react 默認(rèn)支持sass 因?yàn)閟ass比less強(qiáng)大 支持全局函數(shù)

• 1.安裝 sass-resources-loader

npm i sass-resources-loader --save-dev

• 2.暴露配置文件 npm run eject
• 3.修改 config 里面的 webpack.config.js

{
  test: sassRegex,
              exclude: sassModuleRegex,
              use: getStyleLoaders(
                {
                  importLoaders: 2,
                  sourceMap: isEnvProduction && shouldUseSourceMap,
                },
                'sass-loader',
              )
              sideEffects: true,
},

在 getStyleLoaders后面添加如下代碼

.concat({
                  loader: 'sass-resources-loader',
                  options: {
                      resources: [
                          // 這里按照你的文件路徑填寫
                          path.resolve(__dirname, './../src/common.scss')
                      ]
                  }
              })

最終代碼如下

{
              test: sassRegex,
              exclude: sassModuleRegex,
              use: getStyleLoaders(
                {
                  importLoaders: 2,
                  sourceMap: isEnvProduction && shouldUseSourceMap,
                },
                'sass-loader',
              ).concat({
                  loader: 'sass-resources-loader',
                  options: {
                      resources: [
                          // 這里按照你的文件路徑填寫
                          path.resolve(__dirname, './../src/common.scss')
                      ]
                  }
              }),

'./../src/common.scss' 這個(gè)是我的公共的sass路徑 根據(jù)你自己的來配置

改成你自己的路徑

我的全局函數(shù)

• 4.接下來重啟就可以了