next-antd-less
v1.0.0
Published
Use Antd (with Less) with Next.js, Zero Dependency on other Next-Plugins.
Downloads
35
Maintainers
Readme
📦 Installation
yarn add next-antd-less
yarn add --dev babel-plugin-import
🔰 Usage
for [Next.js]
// next.config.js
const withAntdLess = require('next-antd-less');
module.exports = withAntdLess({
modifyVars: { '@primary-color': '#04f' }, // optional
lessVarsFilePath: './src/styles/variables.less', // optional
lessVarsFilePathAppendToEndOfContent: false, // optional
// optional https://github.com/webpack-contrib/css-loader#object
cssLoaderOptions: {
// ...
mode: "local",
localIdentName: "[path][name]__[local]--[hash:base64:5]", // invalid! for Unify getLocalIdent (Next.js / CRA), Cannot set it, but you can rewritten getLocalIdentFn
exportLocalsConvention: "camelCase",
exportOnlyLocals: false,
// ...
getLocalIdent: (context, localIdentName, localName, options) => {
return "whatever_random_class_name";
},
},
// Other Config Here...
webpack(config) {
return config;
},
// ONLY for Next.js 10, if you use Next.js 11, delete this block
future: {
webpack5: true,
},
});
Add a .babelrc.js
// .babelrc.js
module.exports = {
presets: [['next/babel']],
plugins: [['import', { libraryName: 'antd', style: true }]],
};