代码拉取完成,页面将自动刷新
Using antd-theme-generator to change Ant Design theme dynamic for Next.js
It will only import color.less
and less.js
after calling changeTheme
.
npm i next-dynamic-antd-theme
yarn add next-dynamic-antd-theme
See example
const generateTheme = require('next-dynamic-antd-theme/plugin');
const withAntdTheme = generateTheme({
antDir: path.join(__dirname, './node_modules/antd'),
stylesDir: path.join(__dirname, './theme'),
varFile: path.join(__dirname, './theme/vars.less'),
outputFilePath: path.join(__dirname, './.next/static/color.less'), // where to output color.less
// lessFilePath: // default is `${prefix}_next/static/color.less`, color.less path in broswer
// lessJSPath: // default is 'https://cdnjs.cloudflare.com/ajax/libs/less.js/3.11.3/less.min.js', less.js path
});
module.exports = withPlugins([withAntdTheme /* ... */], {
// xxx
});
where you want to change theme
import changeTheme from 'next-dynamic-antd-theme';
changeTheme({ '@primary-color': '#ff0000' }); // primary-color as red
changeTheme('default'); // Ant Design default theme
changeTheme('dark'); // Ant Design Dark theme
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。