Webpack Tailwind和Vuejs项目中我的main.css文件存在问题

尝试使用包含TailwindCSS的网页包设置Vuejs项目。我一直遵循Jerrie的博客帖子（）以及Adam在github（）上的示例中的说明。但在构建main.css文件时，我一直遇到一个问题

我的步骤：

1.）创建Vue项目-

vue init webpack tailwind-test

2.）然后运行NPM安装-

npm install

随着我的Vue项目的建立，我一直在努力添加顺风，但有些困难

3.）安装尾风NPM-

npm install tailwindcss --save-dev

4.）然后添加我的配置文件-

./node_modules/.bin/tailwind init tailwind.js

这就是我遇到问题的地方

5.）创建一个CSS文件-

cd src 
cd assets
mkdir styles 
touch main.css

6.）然后输入main.css文件并添加-

@tailwind preflight; 
@tailwind utilities;

从这里，我的文本编辑器将返回错误“at rule unknown”，这将阻止我对.postsrc.js文件进行最后的更新。

任何反馈都将不胜感激

谢谢

---

-MB

您如何将

main.css

包含到您的项目中

此外，由于vue webpack模板使用PostCs，您可能应该按照文档建议的方式进行操作

@import "tailwindcss/preflight";
@import "tailwindcss/utilities";

---

尽管

@tailwind

仍然可以工作。

我的建议是安装postsss语言支持并将.css重命名为.pcss，然后将package.json脚本（或用于tailwind的任何构建脚本）中的引用从.css更改为.pcss，一切都应该可以正常工作

---

@应用规则也与postsss兼容：

嗨，比尔，不确定我怎么会错过它，但它似乎解决了我的main.css问题！谢谢你引起我的注意。