From a100139e17e3d670212063c6b448da75cc1452d5 Mon Sep 17 00:00:00 2001 From: zefeng Date: Sun, 5 Apr 2020 20:38:56 +0800 Subject: [PATCH] feat(theme): extract theme-js file for supprt mixin theme (#22934) --- .antd-tools.config.js | 2 ++ scripts/compact-vars.js | 4 +--- scripts/dark-vars.js | 4 +--- scripts/default-vars.js | 19 +++++++++++++++++++ scripts/generateColorLess.js | 3 +++ 5 files changed, 26 insertions(+), 6 deletions(-) create mode 100644 scripts/default-vars.js diff --git a/.antd-tools.config.js b/.antd-tools.config.js index 96d5024be4..73502a35fc 100644 --- a/.antd-tools.config.js +++ b/.antd-tools.config.js @@ -2,6 +2,7 @@ const fs = require('fs'); const path = require('path'); // eslint-disable-next-line import/no-extraneous-dependencies const packageInfo = require('./package.json'); +const defaultVars = require('./scripts/default-vars'); const darkVars = require('./scripts/dark-vars'); const compactVars = require('./scripts/compact-vars'); @@ -80,6 +81,7 @@ function finalizeDist() { ); // eslint-disable-next-line no-console console.log('Built a entry less file to dist/antd.less'); + buildThemeFile('default', defaultVars); buildThemeFile('dark', darkVars); buildThemeFile('compact', compactVars); } diff --git a/scripts/compact-vars.js b/scripts/compact-vars.js index e93048ad9c..40093f9759 100644 --- a/scripts/compact-vars.js +++ b/scripts/compact-vars.js @@ -3,11 +3,9 @@ const path = require('path'); const lessToJs = require('less-vars-to-js'); const stylePath = path.join(__dirname, '..', 'components', 'style'); -const colorLess = fs.readFileSync(path.join(stylePath, 'color', 'colors.less'), 'utf8'); -const defaultLess = fs.readFileSync(path.join(stylePath, 'themes', 'default.less'), 'utf8'); const compactLess = fs.readFileSync(path.join(stylePath, 'themes', 'compact.less'), 'utf8'); -const compactPaletteLess = lessToJs(`${colorLess}${defaultLess}${compactLess}`, { +const compactPaletteLess = lessToJs(compactLess, { stripPrefix: true, resolveVariables: false, }); diff --git a/scripts/dark-vars.js b/scripts/dark-vars.js index a28921b393..04ca9e47d5 100644 --- a/scripts/dark-vars.js +++ b/scripts/dark-vars.js @@ -8,11 +8,9 @@ const path = require('path'); const lessToJs = require('less-vars-to-js'); const stylePath = path.join(__dirname, '..', 'components', 'style'); -const colorLess = fs.readFileSync(path.join(stylePath, 'color', 'colors.less'), 'utf8'); -const defaultLess = fs.readFileSync(path.join(stylePath, 'themes', 'default.less'), 'utf8'); const darkLess = fs.readFileSync(path.join(stylePath, 'themes', 'dark.less'), 'utf8'); -const darkPaletteLess = lessToJs(`${colorLess}${defaultLess}${darkLess}`, { +const darkPaletteLess = lessToJs(darkLess, { stripPrefix: true, resolveVariables: false, }); diff --git a/scripts/default-vars.js b/scripts/default-vars.js new file mode 100644 index 0000000000..31f2901909 --- /dev/null +++ b/scripts/default-vars.js @@ -0,0 +1,19 @@ +/** + * convert default.less into js vars + * + * const darkVars = require('./default-vars'); + */ +const fs = require('fs'); +const path = require('path'); +const lessToJs = require('less-vars-to-js'); + +const stylePath = path.join(__dirname, '..', 'components', 'style'); +const colorLess = fs.readFileSync(path.join(stylePath, 'color', 'colors.less'), 'utf8'); +const defaultLess = fs.readFileSync(path.join(stylePath, 'themes', 'default.less'), 'utf8'); + +const defaultPaletteLess = lessToJs(`${colorLess}${defaultLess}`, { + stripPrefix: true, + resolveVariables: false, +}); + +module.exports = defaultPaletteLess; diff --git a/scripts/generateColorLess.js b/scripts/generateColorLess.js index b958c35c5e..c019740da6 100644 --- a/scripts/generateColorLess.js +++ b/scripts/generateColorLess.js @@ -2,6 +2,7 @@ const path = require('path'); const { generateTheme } = require('antd-theme-generator'); const genCss = require('antd-pro-merge-less'); +const defaultVar = require('./default-vars'); const dark = require('./dark-vars'); const compact = require('./compact-vars'); @@ -12,6 +13,7 @@ genCss( theme: 'dark', fileName: './_site/dark.css', modifyVars: { + ...defaultVar, ...dark, '@site-text-color': '@heading-color', '@site-markdown-code-bg': '@input-bg', @@ -21,6 +23,7 @@ genCss( theme: 'compact', fileName: './_site/compact.css', modifyVars: { + ...defaultVar, ...compact, }, },