优化生产

Tailwind CSS非常注重性能，旨在通过仅生成您在项目中实际使用的CSS来生成尽可能小的CSS文件。

结合缩小和网络压缩，这通常会导致CSS文件小于10kB，即使对于大型项目也是如此。例如，Netflix在Netflix Top 10中使用Tailwind整个网站通过网络仅传输6.5kB的CSS。

有了这么小的CSS文件，你就不必担心复杂的解决方案，比如为每个页面拆分CSS代码，而是可以只发布一个下载一次并缓存的小CSS文件，直到你重新部署你的网站。

为了尽可能小的生产构建，我们建议使用cssnano等工具缩小CSS，并使用Brotli压缩CSS.

如果你使用的是Tailwind CLI，你可以通过添加“—minify”标志来缩小CSS：

npx tailwindcss -o build.css --minify

如果您已将Tailwind安装为PostCSS插件，请在插件列表末尾添加“cssnano”：

module.exports = {
  plugins: {
    tailwindcss: {},
    autoprefixer: {},
    ...(process.env.NODE_ENV === 'production' ? { cssnano: {} } : {})
  }
}

如果您使用的是框架，请检查文档，因为这通常在生产中自动为您处理，您甚至不需要配置它。