PostCSS在vue中的使用
1、安装 PostCSS 和所需的插件。在命令行中运行以下命令:
npm install postcss autoprefixer cssnano postcss-pxtorem --save-dev
这将安装 PostCSS、Autoprefixer、CSSnano 和 postcss-pxtorem 插件,同时将它们添加到项目的开发依赖中。
2、在项目根目录下创建一个名为 postcss.config.js 的文件,并在其中配置 PostCSS
module.exports = {
plugins: [
require("autoprefixer"),
require("cssnano"),
require("postcss-pxtorem")({
rootValue: 37.5,
propList: ["*"],
selectorBlackList: ["html"],
}),
],
};
这个配置文件指定了使用 Autoprefixer、CSSnano 和 postcss-pxtorem 插件,并设置了相应的选项。
通常需要将 PostCSS 作为一个处理器插入到构建流程中,并指定要处理的 CSS 文件和目标文件夹
“browserslist”: [
“defaults”,
“not ie < 11”,
“last 2 versions”,
“> 1%”,
“iOS 7”,
“last 3 iOS versions”
]