vite + react + tailwind（2025-08-25）

我知道react和tailwindcss但是我不知道vite要怎么配置,于是有了这篇文章，最终解决方法：

1、npm create vite@latest my-project
2、npm install tailwindcss @tailwindcss/vite
3、Add the @tailwindcss/vite plugin to your Vite configuration.
4、Add an @import to your CSS file that imports Tailwind CSS.
5、npm run dev

ref:https://tailwindcss.com/docs/installation/using-vite

lucide-react 图标的解决方案

---

大语言模型很强，但是因为它的知识不是最新的，占用了我一个小时的时间，还没有解决问题。
于是我尝试查看文档，所以这个时候官方文档的效率会更高。

我看到了这个哥们的文章，其实我也是个return react的人。

https://medium.com/@fasihuddin102/how-to-set-up-tailwindcss-in-a-react-vite-project-2025-edition-999e0541a493

“I didn’t write this article to teach TailwindCSS. I wrote it so you don’t waste 30 minutes like I did.”

⭐Final Thoughts
Whether you’re new to web development or a returning React dev like me, this setup guide will hopefully save you some confusion, stress, and StackOverflow detours.

AI is incredible, but you’re still the one behind the wheel. Use the tools wisely, stay curious, and never underestimate the power of good documentation.

If this post helped, consider clapping 👏, commenting your own experience, or sharing it with a fellow dev who’s fighting with their styling setup.

Happy coding!

同是天涯沦落人，相逢何必增相识。
如果这篇文章有帮助，请考虑点赞👍、评论分享您自己的经验，或者分享给其他人。