tailwind-css - Vite 不基于配置构建顺风
问题描述
我react-ts
使用yarn create @vitejs/app my-app --template react-ts
.
我使用yarn add --dev tailwindcss@latest postcss@latest autoprefixer@latest
.
我初始化了顺风:npx tailwindcss init -p
.
我设置from
并to
在postcss.config.js
:
module.exports = {
from: 'src/styles/App.css',
to: 'src/styles/output.css',
plugins: {
tailwindcss: {},
autoprefixer: {}
}
}
我在以下位置创建了一个App.css
文件src/styles
:
@tailwind base;
@tailwind components;
@tailwind utilities;
根据https://vitejs.dev/guide/features.html#postcss,任何有效postcss-load-config
的语法都是允许的。from
并且to
似乎是允许的。
当我调用yarn dev
which基本上运行vite
时,我的应用程序启动时没有构建错误,但没有生成顺风输出。
我究竟做错了什么?
解决方案
它解决了我的问题
tailwind.config.js
const defaultTheme = require('tailwindcss/defaultTheme')
module.exports = {
mode: 'jit',
purge: {
enabled: process.env.NODE_ENV === 'production',
// classes that are generated dynamically, e.g. `rounded-${size}` and must
// be kept
safeList: [],
content: [
'./index.html',
'./src/**/*.{vue,js,ts}',
// etc.
],
},
theme: {
extend: {
fontFamily: {
sans: ['Inter var', ...defaultTheme.fontFamily.sans],
},
},
},
}
推荐阅读
- c# - 将 umat 与 BackgroundSubtractor 结合使用会导致停止从相机接收帧
- javascript - 使用 Ramda 合并两个具有深度嵌套键的数组
- android - React 本机 android 构建版本代码未更新
- powershell - 从 Powershell 脚本返回对象
- java - 通过 Spring 将对象添加到数据库
- sql - 计算的持久列
- c# - Unity:根据场景之间的对象点击更改相机位置 Unity
- linux - 无法安装来自 ppa for espeak 的 mbrola 西班牙女性声音,我该如何安装?
- php - 如何抓取以双百分号开头和结尾的单词?
- mongodb - MongoDB 使用基于子文档的 Mongoose 过滤器