Bootstrap

vue3+vant 移动端适配

Vant 中的样式默认使用 px 作为单位,如果需要使用 rem 单位,推荐使用以下两个工具:

postcss-pxtorem 是一款 postcss 插件,用于将 px 单位转化为 rem
lib-flexible 用于设置 rem 基准值

1.安装依赖

yarn add amfe-flexible
或者使用
npm i amfe-flexible

然后在 main.js 中加载执行该模块:

import 'amfe-flexible'

2.安装postcss-pxtorem依赖:

yarn add -D postcss-pxtorem
或者是
npm install postcss-pxtorem -D
这里解释一下:# -D 是 --save-dev 的简写 把依赖包的版本信息写进 package.json 文件里面

然后在项目根目录中创建 postcss.config.js 文件:

module.exports = {
    plugins: {
        // postcss-pxtorem 插件的版本需要 >= 5.0.0
// 适用版本 5.1.1
        // yarn add -D [email protected]
        // npm install [email protected] -D
        'postcss-pxtorem': {
            rootValue({ file }) { // 判

悦读

道可道,非常道;名可名,非常名。 无名,天地之始,有名,万物之母。 故常无欲,以观其妙,常有欲,以观其徼。 此两者,同出而异名,同谓之玄,玄之又玄,众妙之门。

;