React中TypeScript如何配置Less、px转reem、antd-mobile和路由

创建项目

create-react-app ts3 --template typescript

配置less

cnpm install less-loader less --save-dev

查找 node_modules 下面的react-scripts/config/webpack.config.js
上面两行代码放在

接着ctrl+f查找这个sassModuleRegex 放在这段注释的上面

const lessRegex = /\.less$/;
const lessModuleRegex = /\.module\.less$/;


  {
              test: lessRegex,
              exclude: sassModuleRegex,
              use: getStyleLoaders(
                {
                  importLoaders: 2,
                  sourceMap: isEnvProduction && shouldUseSourceMap,
                },
                'less-loader'
              ),
              sideEffects: true,
            },
            {
              test: lessModuleRegex,
              use: getStyleLoaders(
                {
                  importLoaders: 2,
                  sourceMap: isEnvProduction && shouldUseSourceMap,
                  modules: true,
                  getLocalIdent: getCSSModuleLocalIdent,
                },
                'less-loader'
              ),
            },

配置less报错修改TypeError: this.getOptions is not a function
是因为less-loder版本过高，安装下旧版本
卸载

cnpm uninstall --save less-loader

安装

cnpm install -D less-loader@7.x

新建一个less文件
然后手动引入到App.tsx中