React使用TypeScript和Less

React使用TypeScript和less

创建应用

yarn create react-app react-ts --template typescript

创建好了之后需要使用less,则需要噢诶之less(使用craco)

yarn add @craco/craco

然后安装craco-less

yarn add craco less

然后在package.json中修改命令

  "start": "craco start", 
  "build": "craco build",
  "test": "craco test",**

然后创建craco.config.js文件

const CracoLessPlugin = require("craco-less");

module.exports = {
  plugins: [
    {
      plugin: CracoLessPlugin,
      options: {
        lessLoaderOptions: {
          lessOptions: {
            modifyVars: {},
            javascriptEnabled: true,
          },
        },
      },
    },
  ],
  webpack: {
    // 这里面是webpack的配置
  },
};

这样就完成了关于less的使用配置和TypeScript的使用配置