一个 NextJS 项目的多个 Tailwind 配置文件

Question

我的问题是，两个 NextJS 布局是否可以有两个配置（tailwind.css）？

基本上我想要一个 frontend-tailwind.js 和一个 backend-tailwind.js 在 两个中生成两个样式表 backend.scss 和 frontend.scss下一个布局...

感谢您的帮助。

Answer 1

我创建了两个布局并在每个布局上添加了一个经典的链接样式表（示例如下）

<link rel="preload" href={process.env.NODE_ENV === 'development' ? `/css/tailwind-dev.css` : `/css/prod.min.css?${refreshCache}`} media="all" rel="stylesheet" type="text/css" />

我使用了两个 Gulp 任务，一个用于构建 TailwindCSS dev（带有所有主题），另一个用于构建 prod 文件（带有 purgecss、cleanCSS、concat...）... PurgeCSS 正则表达式在这里：https://tailwindcss.com/docs/optimizing-for-production