Tailwind 不会吹扫

Posted 2023-03-07

【中文标题】Tailwind 不会吹扫

【英文标题】：Tailwind will not purge

【发布时间】：2021-08-10 20:18:45

【问题描述】：

我试图让顺风清除我文件上的 CSS，但我似乎无法让它工作。

为了提供一些上下文，我有一个公用文件夹，其中包含一个 CSS 文件夹和一个视图文件夹。我正在尝试清除 views 文件夹中的单个 ejs 文件。

这是我的 tailwind.config.js

module.exports = 
 purge: 
  enabled: true,
  content: ['./public/**/*.ejs']
 ,
 theme: ,
 variants: ,
 plugins: [],

这是我的 postcss.config.js

module.exports = 
  plugins: 
  tailwindcss: ,
  autoprefixer: ,
 

这是我从 package.json 运行的脚本

    "tw-prod": "tailwind build public/css/tailwind.css -o public/css/style.css"

我也尝试了以下方法，但没有任何运气

"tw-prod": "postcss public/css/tailwind.css -o public/css/style.css"

最后是我的 app.js 中的一些代码，它可能有助于诊断我的问题

app.use(express.static("public"));

app.set("view engine", "ejs");

app.set('views', path.join(__dirname, '/public/views'));

每次我运行构建脚本时，样式表的大小都保持不变，为 3.81mb。谁能告诉我我在这里做错了什么？

【参考方案1】：

您是否尝试使用NODE_ENV=production 运行脚本？ 喜欢

NODE_ENV=production npx tailwindcss -i ./src/tailwind.css -o ./dist/tailwind.css

编辑： 而不是运行

"tw-prod": "tailwind build public/css/tailwind.css -o public/css/style.css"

运行这个

"tw-prod": "NODE_ENV=production tailwind build public/css/tailwind.css -o public/css/style.css"

Tailwind 需要设置 NODE_ENV 才能启动清除功能并完成其工作。

阅读更多关于这个here

PS: BTS postcss 文件现在默认配置，我猜它负责这个清除功能

【讨论】：

将NODE_ENV=production 添加到我的顺风版本中解决了这个问题。它从 4MB 变成了 41KB！谢谢老哥！

【参考方案2】：

您正在清除“公共”目录。您的“意见”是否在“公共”目录中？如果您使用公共目录来托管静态资产和“模板”或“视图”目录来存储 ejs 视图，您应该清除正确的目录（“视图”或“公共”而不是“公共”目录）。你试过这样做吗？

在你的情况下..你应该清除 public/views/**/*.ejs 文件