配置React项目 及 LESS 或 SASS 的引入

0、安装 node.js

一、建立一个react-app
建议采用官网方式：https://reactjs.org/docs/crea...

npx create-react-app my-app
cd my-app
npm start

二、暴露webpack

npm run eject

三、下载 LESS 或者 SASS （采用下面一种方式便可）

npm install less-loader less --save-dev               // 下载LESS
npm install sass-loader node-sass --save-dev          // 下载SASS

四、配置config文件下的 webpack.config.dev.js 及 webpack.config.prod.js ,两格文件修改的是同样的地方，故只展现一个文件
图一是配置LESS的，只修改红色框框处

// 修改前
    test: /\.css$/,
// 修改后代码
    test: /\.css|less$/,
    
// 在该处新添加
{
    loader: require.resolve('less-loader')
},

图二是配置SASS的，只修改红色框框处,修改方式与LESS相同

// 修改前
    test: /\.css$/,
// 修改后代码
    test: /\.css|scss$/,
    
// 在该处新添加
{
    loader: require.resolve('sass-loader')
},

五、最后添加.less文件 或 .scss文件就能够运行了。