vite.config.ts页面的配置

vite配置文档地址：https://cn.vitejs.dev/config/

import { defineConfig } from 'vite'
import vue form '@vitejs/pluign-vue'

import postCssPxToRem from 'postcss-pxtorem'
import { resolve } from 'path'

export default defineConfig({
    plugins: [vue()],
    resolve: {
        alias: {
            '@': resolve(__dirname, 'src')//配置名@默认在src下
        },
        extensions: ['.js', '.ts', '.jsx', '.tsx', '.json', '.vue', '.mjs'] //import的时候拓展名自动识别
    },
    css: {
        preprocessorOptions: {
            scss: {
                additionalData: `@use "@/assets/style/global-scss-var.scss" as *`//全局的变量文件引入变量可以再其他的scss文件里面引用
            }
        },
        //vite 中已继承了postcss https://cn.vitejs.dev/config/shared-options.html#css-postcss
        postcss: {
            plugins: [require('autoprefixer')({ //样式名称前缀的补全-webkit-等等 引入autoprefixer插件
                overrideBrowserslist: [
                    'Android 4.1',
                    'iOS 7.1',
                    'Chrome > 31',
                    'ff > 31',
                    'ie >= 8',
                    '> 1%',
                ],
                grid: true,
            }), {
                //vite 打包的时候报 @charset UTF-8 的警告去除
                postcssPlugin: 'internal:charset-removal',
                AtRule: {
                    charset: (atRule) => {
                        if (atRule.name === 'charset') {
                            atRule.remove()
                        }
                    }
                }
            },
            postCssPxToRem({
                rootValue: 100,//设计稿尺寸100px==0.1rem好计算
                propList: ['*'], //需要转换的属性，这里全部转换
                selectorBlackList: ['.norem'],//过滤调.norem-开头的class 不进行rem转换 PX也不会转换
                exclude: '/node_modules/i',//node_modules下面的文件不进行转
            })]
        },
    }
})