解决 React 官方脚手架不支持 Less 的问题

首先添加依赖npm install -g create-react-app或者yarn add less less-loader

修改 webpack 配置：

const  cssRegex = /\.(css|less)$/;

const  cssModuleRegex = /\.module\.(css|less)$/;

const  getStyleLoaders = (cssOptions, preProcessor) => {

    const  loaders = [

        isEnvDevelopment && require.resolve('style-loader'),

        isEnvProduction && {

            loader:  MiniCssExtractPlugin.loader,

            options:  shouldUseRelativeAssetPaths ? { publicPath:  '../../' } : {},

        },

        {

            loader:  require.resolve('css-loader'),

            options:  cssOptions,

        },

        {

            loader:  require.resolve('less-loader'),

        },

      ......

})

或者

{

    test: /\.less$/,

    use: extractTextPlugin.extract({

        use: [{

            loader: "css-loader"

        }, {

            loader: "less-loader"

        }],

// use style-loader in development

        fallback: "style-loader"

     })

}

遇到的报错：

Failed to compile.

webpack is not a function

npm ERR! code ELIFECYCLE

npm ERR! errno 1

npm ERR! project@0.1.0 start: `node scripts/start.js`

npm ERR! Exit status 1

npm ERR!

npm ERR! Failed at the project@0.1.0 start script.

npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

解决方案：https://stackoverflow.com/questions/55140033/failed-to-compile-webpack-is-not-a-function