先切换 npm 的镜像源 ,安装快的可以直接执行下一步
npm config set registry https://registry.npm.taobao.org
npm install -g create-react-app
create-react-app 你的项目名字
安装less
npm install less less-loader
安装好 执行
npm run eject
找到webpack.config.js文件加上
// style files regexes
const cssRegex = /\.css\$/;
const cssModuleRegex = /\.module\.css$/;
const sassRegex = /\.(scss|sass)$/;
const sassModuleRegex = /\.module\.(scss|sass)$/;
const lessRegex = /\.(less)$/;
const lessModuleRegex = /\.module\.(less)$/;
找到文件中cssRegex 和 sassRegex的配置项 加上
// Less 解析配置
{
test: lessRegex,
exclude: lessModuleRegex,
use: getStyleLoaders(
{
importLoaders: 2,
sourceMap: isEnvProduction && shouldUseSourceMap,
modules: true
},
"less-loader"
),
sideEffects: true,
},
{
test: lessModuleRegex,
use: getStyleLoaders(
{
importLoaders: 2,
sourceMap: isEnvProduction && shouldUseSourceMap,
modules: true,
getLocalIdent: getCSSModuleLocalIdent,
},
"less-loader"
),
},
这时我们的react项目就可以使用less了
感谢create-react-app 支持less踩坑的文章