import autoprefixer from 'autoprefixer'; import postcssResponsiveType from 'postcss-responsive-type'; import pxToViewport from 'postcss-px-to-viewport'; // 使用新的PostCSS 8 API创建自定义的px-to-viewport插件 const customPxToViewportPlugin = (options) => { return { postcssPlugin: 'custom-px-to-viewport', Once(root, { result }) { const file = result.opts.from; let viewportWidth = options.defaultViewportWidth || 375; // 设置默认值 if (file?.includes('vant')) { viewportWidth = 375; }else{ viewportWidth = 1920; } const pxToViewportInstance = pxToViewport({ ...options, viewportWidth: viewportWidth, }); if (file) { pxToViewportInstance(root, result); } } }; }; // 定义postcss插件名称 customPxToViewportPlugin.postcss = true; export default { plugins: [ autoprefixer(), // 自动添加浏览器前缀 postcssResponsiveType(), // 自动调整文本大小 customPxToViewportPlugin({ defaultViewportWidth:1920, unitPrecision: 5, // 保留的小数位数 selectorBlackList: [/^\.van/], // 以 .van 开头的类名不转换 minPixelValue: 1, // 小于或等于 1px 不转换 viewportUnit: "vw", // 转换后的单位 fontViewportUnit: "vw", // 字体单位 unitToConvert: "px" // 需要转换的单位 }), ], };