如何使用tailwindcss将样式文件夹移动到nextjs typescript中的src文件夹

Question

我使用带有typescript和tailwindcss的nextjs。我想把styles文件夹移到src文件夹，我已经在tsconfig.json文件中添加了值为src的baseUrl选项，但我得到了这样的错误：

./node_modules/next/dist/compiled/css-loader/cjs.js??ruleSet[1].rules[2].oneOf[5].use[1]!./node_modules/next/dist/compiled/postcss-loader/cjs.js??ruleSet[1].rules[2].oneOf[5].use[2]!./node_modules/tailwindcss/tailwind.css
TypeError: Object.fromEntries is not a function

以及如何将styles文件夹移到src文件夹，我想让我的文件夹结构更简单。谢谢

Answer 1

删除.next文件夹，然后再次运行开发服务器(使用npm run dev(。

这对我来说是有效的。我猜这是某种缓存问题。显然，您需要更改tailwind.config.js，其中内容应该检查./src/**/*.{js,jsx,ts,tsx}而不是./pages/**/*.{js,jsx,ts,tsx}。

Answer 2

在src下移动文件以清理根目录后，我也遇到了同样的问题。我从Tailwind实验室的这个示例repo中复制了tailwind.config.js的配置选项，发现它对我有效

module.exports = {
purge: {
content: ['./src/**/*.{js,jsx,ts,tsx}', './next.config.js'],
},
...

Answer 3

配置文件必须像next.config.js一样存储在主根目录中。但是样式文件可以存储在src目录中。阅读此文档：https://tailwindcss.com/docs/guides/nextjs