diff --git a/scripts/compile.js b/scripts/compile.js index 375a383..a095f1d 100644 --- a/scripts/compile.js +++ b/scripts/compile.js @@ -17,7 +17,7 @@ const sass = require("sass"); const path = require("path"); const minimist = require("minimist"); const sassExtract = require("sass-extract"); -const themeConfig = require("../src/themes/config"); +const themeConfig = require("../src/themes/mweb-config"); const { adjust } = require("./utils"); const args = minimist(process.argv.slice(2), { string: ["file", "platform", "themeDir", "distDir"], @@ -31,16 +31,18 @@ const args = minimist(process.argv.slice(2), { const platformConfig = { mweb: { filter: (filename) => /^mweb-/.test(filename), // 过滤需要编译的 scss 文件 - namer: (filename) => `${path.parse(filename).name}.css`, // scss 编译后写入的文件名 - }, - typora: { - filter: (filename) => /^typora-/.test(filename), - namer: (filename) => `${path.parse(filename).name}.css`, + namer: (filename) => `${filename}.css`, // scss 编译后写入的文件名 + writer: writerForMWeb }, mweb4: { filter: (filename) => /^mweb-/.test(filename), - namer: (filename) => `${path.parse(filename).name}.mwebtheme`, + namer: (filename) => `${filename}.mwebtheme`, compiler: compilerForMWeb4, + writer: writerForMWeb + }, + typora: { + filter: (filename) => /^typora-/.test(filename), + namer: (filename) => `${filename}.css`, }, }; @@ -395,10 +397,28 @@ function compilerForMWeb4({ filePath }) { ${css}`; } -function writeFile({ filePath, css }) { +function write({ filePath, css }) { + fs.ensureDirSync(args.distDir); const { namer } = platformConfig[args.platform]; - const filename = path.basename(filePath); - const outFile = `${args.distDir}/${namer(filename)}`; + const filename = path.basename(filePath); // with extension + const outFile = `${args.distDir}/${namer(path.parse(filename).name)}`; + fs.writeFile(outFile, css, (error) => { + if (error) { + console.log(`写入文件失败:${outFile}`, error); + process.exit(1); + } else console.log(`输出:${outFile}`); + }); +} + +function writerForMWeb({ filePath, css }) { + fs.ensureDirSync(args.distDir); + fs.ensureDirSync(args.distDir + '/dark'); + fs.ensureDirSync(args.distDir + '/light'); + const { namer } = platformConfig[args.platform]; + const themeName = filePath.match(/mweb-(.*)\.scss$/)[1]; // eg: ayu, lark, etc. + const filename = filePath.match(/(mweb-.*)\.scss$/)[1]; + const isDark = themeConfig[themeName].mode == "dark"; + const outFile = `${args.distDir}/${isDark ? 'dark' : 'light'}/${namer(filename)}`; fs.writeFile(outFile, css, (error) => { if (error) { console.log(`写入文件失败:${outFile}`, error); @@ -409,7 +429,6 @@ function writeFile({ filePath, css }) { function main() { fs.removeSync(args.distDir); - fs.ensureDirSync(args.distDir); const cfg = platformConfig[args.platform]; const files = args.file @@ -426,7 +445,9 @@ function main() { let css = cfg.compiler ? await cfg.compiler({ filePath }) : await compile({ filePath }); - writeFile({ filePath, css }); + cfg.writer + ? await cfg.writer({ filePath, css }) + : await write({ filePath, css }); } catch (err) { console.log("sass 编译失败:", err); process.exit(1); diff --git a/scripts/gallery/utils.js b/scripts/gallery/utils.js index a49cf2b..26b3684 100644 --- a/scripts/gallery/utils.js +++ b/scripts/gallery/utils.js @@ -13,7 +13,7 @@ const toRootPrefix = "../../"; const fromRoot = (pathFromRoot) => toRootPrefix + pathFromRoot; const filePath = (file) => path.join(__dirname, `${file}`); -const themes = require(fromRoot("src/themes/config")); +const themes = require(fromRoot("src/themes/mweb-config.js")); const buildScss = async ({ distPath, minify }) => { fs.ensureDirSync(filePath(distPath + "/js")); diff --git a/src/themes/config.js b/src/themes/mweb-config.js similarity index 93% rename from src/themes/config.js rename to src/themes/mweb-config.js index 302861f..f310910 100644 --- a/src/themes/config.js +++ b/src/themes/mweb-config.js @@ -1,7 +1,8 @@ /** * 每次新增一个 mweb 主题文件,都需要在这里新增一项,字段包括: - * - file:文件名 - * - mode(可选):"dark",是否是深色主题 + * - file: 文件名 + * - mode(可选): "dark",是否是深色主题 + * - isMWeb4EditorThemeCompatible: 是否支持生成 MWeb 4.x 的编辑器主题,必须配置 sass 颜色变量才可以 */ const themes = {