解决vue-cli4.x 装tailwindcss遇到的坑

解决vue-cli4.x 装tailwindcss遇到的坑

一、tailwind的配置和使用
1、配置项目
1.1新建项目
//第一步：
vue create “项目名”

//第二步
cd 项目名

//安装tailwind

 npm install tailwindcss

1.2在vscode里操作
1.2.1把建好的项目拖进vscode
1.2.2在项目的src/assets下，新建css文件夹
1.2.3在css文件夹里新建全局样式reset.css

@import "tailwindcss/base";
@import "tailwindcss/components";
@import "tailwindcss/utilities";

1.3在main.js里（注意路径）
import ‘./assets/css/reset.css’

1.4在cmd里（官网提供这步，但我不用也能实现）

npx tailwindcss init --full

会生成一个tailwind.config.js文件

1.5src目录下新建postcss.config.js
并在该文件里复制如下代码

const rege = [
    /el-.+$/,
    /::-webkit/,
    /v-/,
    /^!/,
    /class/,
    /-(leave|enter|appear)(|-(to|from|active))$/,
    /^(?