Browse Source

Revert "feat: add getThemeVar file to support theme config and fix 4.1.2 theme config breaking change"

This reverts commit 3d9b891a26.
pull/23171/head
baozefeng 5 years ago
parent
commit
9c2473ab25
  1. 58
      .antd-tools.config.js
  2. 14
      docs/react/customize-theme.en-US.md
  3. 14
      docs/react/customize-theme.zh-CN.md

58
.antd-tools.config.js

@ -61,31 +61,11 @@ function buildThemeFile(theme, vars) {
// eslint-disable-next-line no-console
console.log(`Built a entry less file to dist/antd.${theme}.less`);
if (theme === 'default') {
fs.writeFileSync(
path.join(process.cwd(), 'dist', `default-theme.js`),
`module.exports = ${JSON.stringify(vars, null, 2)};\n`,
);
return;
}
// Build ${theme}.js: dist/${theme}-theme.js, for less-loader
fs.writeFileSync(
path.join(process.cwd(), 'dist', `getThemeVar.js`),
`const ${theme}ThemeSingle = ${JSON.stringify(vars, null, 2)};\n`,
{
flag: 'a',
},
);
fs.writeFileSync(
path.join(process.cwd(), 'dist', `${theme}-theme.js`),
`const { ${theme}ThemeSingle } = require('./getThemeVar');\nconst defaultTheme = require('./defaultTheme');\n
module.exports = {
...${theme}ThemeSingle,
...defaultTheme
}`,
`module.exports = ${JSON.stringify(vars, null, 2)};`,
);
// eslint-disable-next-line no-console
@ -100,46 +80,10 @@ function finalizeDist() {
'@import "../lib/style/index.less";\n@import "../lib/style/components.less";',
);
// eslint-disable-next-line no-console
fs.writeFileSync(
path.join(process.cwd(), 'dist', 'getThemeVar.js'),
`const defaultTheme = require('./default-theme.js');\n`,
);
console.log('Built a entry less file to dist/antd.less');
buildThemeFile('default', defaultVars);
buildThemeFile('dark', darkVars);
buildThemeFile('compact', compactVars);
fs.writeFileSync(
path.join(process.cwd(), 'dist', `getThemeVar.js`),
`
function getThemeVar(options = {}) {
let themeVar = {
'hack': \`true;@import "\${require.resolve('antd/lib/style/color/colorPalette.less')}";\`,
...defaultTheme
};
if(options.dark) {
themeVar = {
...themeVar,
...darkThemeSingle
}
}
if(options.compact){
themeVar = {
...themeVar,
...compactThemeSingle
}
}
return themeVar;
}
module.exports = {
darkThemeSingle,
compactThemeSingle,
getThemeVar
}`,
{
flag: 'a',
},
);
}
}

14
docs/react/customize-theme.en-US.md

@ -182,7 +182,9 @@ If the project does not use Less, you can import [antd.dark.css](https://unpkg.c
Method 3: using [less-loader](https://github.com/webpack-contrib/less-loader) in `webpack.config.js` to introduce as needed:
```diff
const { getThemeVar } = require('antd/dist/getThemeVar');
const defaultTheme = require('antd/dist/default-theme');
const darkTheme = require('antd/dist/dark-theme');
const compactTheme = require('antd/dist/compact-theme');
// webpack.config.js
module.exports = {
@ -195,10 +197,12 @@ module.exports = {
}, {
loader: 'less-loader', // compiles Less to CSS
+ options: {
+ modifyVars: getThemeVar({
+ dark: true, // enable dark mode
+ compact: true, // enable compact mode
+ }),
+ modifyVars: {
+ 'hack': `true;@import "${require.resolve('antd/lib/style/color/colorPalette.less')}";`,
+ ...defaultTheme, // darkTheme and compactTheme depend on defaultTheme
+ ...darkTheme,
+ ...compactTheme,
+ },
+ javascriptEnabled: true,
+ },
}],

14
docs/react/customize-theme.zh-CN.md

@ -160,7 +160,9 @@ module.exports = {
方式三:是用在 `webpack.config.js` 使用 [less-loader](https://github.com/webpack-contrib/less-loader) 按需引入:
```diff
const { getThemeVar } = require('antd/dist/getThemeVar');
const defaultTheme = require('antd/dist/default-theme');
const darkTheme = require('antd/dist/dark-theme');
const compactTheme = require('antd/dist/compact-theme');
// webpack.config.js
module.exports = {
@ -173,10 +175,12 @@ module.exports = {
}, {
loader: 'less-loader', // compiles Less to CSS
+ options: {
+ modifyVars: getThemeVar({
+ dark: true, // 开启暗黑模式
+ compact: true, // 开启紧凑模式
+ }),
+ modifyVars: {
+ 'hack': `true;@import "${require.resolve('antd/lib/style/color/colorPalette.less')}";`,
+ ...defaultTheme, // darkTheme 和 compactTheme 依赖 defaultTheme
+ ...darkTheme,
+ ...compactTheme,
+ },
+ javascriptEnabled: true,
+ },
}],

Loading…
Cancel
Save