首页 前端知识 vite配置postcss

vite配置postcss

2024-06-08 09:06:54 前端知识 前端哥 464 748 我要收藏

1.搭建项目

pnpm create vite

2.下载postcss

pnpm i postcss
pnpm i postcss-pxtorem 
pnpm i autoprefixer

        也可以去官网找其他插件下载

3.配置vite.config.js

import postCssPxToRem from 'postcss-pxtorem'
import autoprefixer from 'autoprefixer'
 
export default () => {
    return {
        css: {
            postcss: { 
                plugins: [
                    postCssPxToRem({ // 自适应,px>rem转换
                        rootValue: 16, // 1rem的大小
                        propList: ['*'], // 需要转换的属性,这里选择全部都进行转换
                    }),
                    autoprefixer({ // 自动添加前缀
                        overrideBrowserslist: [
                            "Android 4.1",
                            "iOS 7.1",
                            "Chrome > 31",
                            "ff > 31",
                            "ie >= 8"
                        ],
                    })
                ]
            },
        }
    };
}

参考:

http://t.csdnimg.cn/J84pt

转载请注明出处或者链接地址:https://www.qianduange.cn//article/11427.html
标签
postcss
评论
发布的文章

JQuery中的load()、$

2024-05-10 08:05:15

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!