配置less支持

1.运行项目,暴露config配置文件

npm run eject

2.下载所需插件

cnpm i babel-plugin-import --save
cnpm i less --save
cnpm i less-loader --save
cnpm i antd --save
cnpm i react-loadable --save

3.打开package.json,在babel里面添加

"plugins": [["import", { "libraryName": "antd", "style": true }]]     //使用antd  允许less

????:package.json文件不能添加注释
4.找到webpack.config.js文件中的cssRegex变量。修改为:

const cssRegex = /\.(css|less)$/;   //包括less文件

5.在cssRegex变量的下边找到getStyleLoaders函数,给函数的 loaders 数组增加一个元素 让其调用less-loader解析less

{loader:require.resolve('less-loader'),options:{javascriptEnabled: true}}

6.在 webpack.config.js 中的 module.exports 中找到 resolve 属性 在设置他的 alias 对象

'@': paths.appSrc,     //通过 @  定位到src   paths 对象里有每个文件的地址引用   可修改

这样就大功告成了。

Last modification:October 19th, 2019 at 04:41 pm
如果觉得我的文章对你有用,请随意赞赏