react+umi+taiwinds配置问题

1.我得umi版本是3.5.37,需要下载的东西:

yarn add  tailwindcss@npm:@tailwindcss postcss7-compat @tailwindcss/postcss7-compat autoprefixer@^9

2.添加tailwind.config.js配置文件

module.exports = {
          
   
    mode: "jit",
    purge: ["./src/**/*.{ts,tsx,js,jsx}"],
    darkMode: false,
    theme: {
          
   
      extend:{
          
   
        colors:{
          
   
          gega:#243c5a
        },
        spacing: {
          
   
          13: 3.25rem,
        }
      },
      screens:{
          
   
        sm:330px,
        md:540px,
        lg:1200px
      }
    },
    variants: {
          
   },
    plugins: [],
  };

3.添加umi配置,.umirc.ts

extraPostCSSPlugins: [require("tailwindcss"), require("autoprefixer")],

4.在共工样式中添加

@tailwind utilities;

这时你可以运行了,但是坑来了,更改样式后不热更新,so需要下载cross-env插件(针对window系统),下载后需要配置启动:

"start": "cross-env TAILWIND_MODE=watch   umi dev",

基本就ok了