配置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文件就能夠運行了。