html - npm run build 并观看非常慢

Question

我正在尝试创建一个基本的 Tailwind 入门元素，当我尝试运行 npm run build 或 npm run watch 命令时，大约需要 30-60秒做出改变。这是我的设置:

package.json:

{
  "name": "base",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "postcss css/style.css -o public/build/style.css",
    "watch:css": "onchange 'css/*.css' -- npm run build"
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "autoprefixer": "^10.0.3",
    "postcss": "^8.1.10",
    "postcss-cli": "^8.3.0",
    "tailwindcss": "^2.0.1",
    "watch": "^1.0.2"
  },
  "devDependencies": {
    "@fullhuman/postcss-purgecss": "^3.0.0",
    "cssnano": "^4.1.10",
    "onchange": "^7.1.0"
  }
}

postcss.config.css:

const purgecss = require('@fullhuman/postcss-purgecss')

module.exports = {
  plugins: [
    require('tailwindcss'),
    require('autoprefixer'),
    require('cssnano')({
           preset: 'default',
       }),
    // purgecss({
    //    content: ['./**/*.html'],
    //    defaultExtractor: content => content.match(/[\w-/:]+(?<!:)/g) || []
    //  })
  ]
}

目录:

--public
    build
        main.css
   index.html
--src
    css
        tailwind.css
--package.json
--postcss.config.js
--tailwind.config.js

Answer 1

build 应该是 postcss public/build/main.css -o src/css/tailwind.css，删除所有对@fullhuman/postcss-purgecss 的引用，然后查看 https://tailwindcss.com/docs/installation