can not use in antd-design-mobile
guoguo0202 opened this issue · comments
RT:
Error { [Error: JavaScript evaluation error: 'ReferenceError: colorPalette is not defined']
message:'JavaScript evaluation error: \'ReferenceError: colorPalette is not defined\'',
stack: undefined,
type: 'Syntax',
filename: 'input',
index: 124170,
line: 5808,
column: 32,
callLine: NaN,
callExtract: undefined,
extract:
[ '',
'.brand-primary-7 { color: color(~`colorPalette("@{brand-primary}", 7)`); }',
' .brand-primary-5 { color: color(~`colorPalette("@{brand-primary}", 5)`); }' ] }
Maybe you need to load the default colorPalette
from the antd/lib/style/color/colorPalette.less
, like this:
const { override, addLessLoader } = require('customize-cra');
const loaderOptions = {
modifyVars: {
'hack': `true;@import "${require.resolve('antd/lib/style/color/colorPalette.less')}";`
},
javascriptEnabled: true
};
module.exports = override(
...other-plugins,
addLessLoader(loaderOptions),
themePlugin
);
Thanks @DarwinniwraD for your help. @guoguo0202 above comment helped you, kindly mention here and close the issue. Otherwise this package is designed to work with ant design and not with any other ant design related project.
Hey, I have the same issue while trying to using this plugin with antd-mobile
. Seems there's no colorPalette
in the ant design mobile version. So, I think this plugin may not work for antd-mobile
yet.
You can try copying colorPalette
code from ant design source code and put it in your main.less file
it seems that it only happens when antd.less is imported in multiple .less files. if I import antd.less in only one less file (say App.less), the problem disappears!