基于Wasm实现对html字符串中px单位的转换,配合 postcss-px-to-viewport-8-plugin实现移动端适配,解决js正则替换实现方式对长文本处理时的性能问题。
yarn add -D vite-plugin-wasm
yarn add -D vite-plugin-top-level-await
import wasm from "vite-plugin-wasm";
import topLevelAwait from "vite-plugin-top-level-await";
export default defineConfig({
plugins: [
wasm(),
topLevelAwait()
]
});
安装本项目:
yarn add -D postcss_px_to_viewport_plugin_wasm
import { convert_px_to_vw } from "postcss_px_to_viewport_wasm_plugin";
const res = convert_px_to_vw(str,{
viewportWidth: 750, // 750设计稿的viewport
ignoreUnitCase: true, // 转换单位是否忽略大小写
unitPrecision: 2, // 单元精度
})