Tailwind Example基础前端模板，集成Tailwind CSS、Webpack 5和PurgeCSS
tailwind-example 的前端启动项目，还挺适合拿来做主题开发的，尤其是配合 Concrete5 的时候更顺。它整合了 Tailwind CSS、Webpack 5、PurgeCSS，而且配置也不复杂，新手摸起来也没啥负担。
支持 JIT 模式的 Tailwind 2.1，响应快，构建快，开发体验是真的顺畅。像 @tailwind/forms 和 @tailwind/typography 这些常用扩展也直接集成好了，不用你手动再折腾。
直接跑 npm run build，就能在 dist 下看到生成的 HTML 和 CSS 文件，适合快速验证页面效果。如果是开发阶段，就用 npm run dev，它会弹出浏览器，自动热更新，改完立即看，挺方便的。
比较的一点，它还专门适配了 Concrete5。只要跑 npm run build:c5，就会生成包含 PHP、CSS、JS 的主题结构，直接塞到 Concrete5 项目里就能用了。
如果你项目是 Vue 或 React 的，也可以参考这套结构调整一下，Webpack 5 配置还挺通用。想研究更细的话，可以去看看这些相关文章，比如 webpack5 基础配置 和 学习笔记。
要注意的一点是，开发构建的文件会挺大的，建议上线前一定要用生产模式重新构建，免得拖慢加载速度。
如果你正好在折腾 Concrete5 主题，或者想找个干净利落的 TailwindCSS + Webpack 起手项目，可以把这个仓库克隆下来研究一下，还是蛮有参考价值的。
文件大小：196.61KB
评论区