如何将tailwindcss添加到vite?

本文介绍了如何将tailwindcss添加到vite?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在使用 vite 0.16.6 并且想要迁移一个使用 vite 的 vuepress 站点.

I'm using vite 0.16.6 and wanted to migrated a vuepress site to using vite.

但是我不确定如何配置 vite 以使用 tailwindcss.

However I was unsure how to configure vite to using tailwindcss.

在我的index.css

@tailwind base;
@tailwind components;
@tailwind utilities;

#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}

推荐答案

经过一番挖掘，看起来我们必须在应用程序的根目录中包含一个 postcss.config.js>

After some digging, looks like that we have to include a postcss.config.js in the root directory of the application

module.exports = {
  plugins: [
    // ...
    require('tailwindcss'),
    require('autoprefixer'),
    // ...
  ]
}

这篇关于如何将tailwindcss添加到vite?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！

Vite