如何在 vercel zeit 上使用 Tailwindcss 2.0 部署 nuxt.js 项目

问题描述

我正在尝试使用 tailwind.css 2.0 上传一个基本的 nuxt.js 项目。 我用过:

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

安装tailwindcss 2.0

首先我使用 npm 然后使用 yarn 但在部署时 tailwindcss 2.0 不起作用。 在本地效果很好。

解决方法

如果没有更多细节,我真的无法判断,但是如果您在生产中遇到困难但在开发中遇到了 tailwindcss 项目的困难 - 首先要检查的是您是否使用了动态类名(例如,{{1 }})。这些 will be purged 正在生产中,除非您将它们添加到许可名单中。

更新

查看您提供的存储库后,问题似乎是 Tailwind 生成 CSS 定位 text-${color}-500,但这在您的 Nuxt 应用生成的 HTML 中被 [type='text'] 清除(请参阅issue)。您可以在 html-minifier:

中使用此代码关闭此行为
nuxt.config