github:GitHub - cuth/postcss-pxtorem: Convert pixel units to rem (root em) units using PostCSS
他说这是PostCSS 插件,可从像素单位生成 rem 单位。
既然是插件,看vite共享选项 | Vite 官方中文文档
图里提到PostCSS 是个插件(图一),vite官网写着插件要用数组格式
所以配置大概是这样
点进看看 刚刚的文档的数组格式(图二)看看postcss-load-config/README.md at main · postcss/postcss-load-config · GitHub
参考一下插件文档
所以配置好是这个样子的
import { fileURLToPath, URL } from 'node:url'
import pxtorem from 'postcss-pxtorem'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
],
css: {
postcss: {
plugins: [
pxtorem({
rootValue: 37.5,
propList: ["*"]
})
]
}
},
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
我只配了一个属性,你想具体就去看github文档
ts报错无法找到postcss-pxtorem模块类型声明
下载类型文件
安装就行
npm install --save @types/postcss-pxtorem