VUE2.0 は H5 プロジェクトをビルドします

1.VUE2.0プロジェクトをビルドする

vue create '项目名'

2. フレキシブルプラグイン（モバイルプラグインに対応）をインストールします。

npm install lib-flexible -S

2.1 main.js に柔軟なプラグインを導入する

import 'amfe-flexible';

3. postcss-pxtorem をインストールします (px を rem に変換します)

npm install postcss-pxtorem --save // 默认最新版本

// 安装这个版本  版本过高有可能会出现问题
npm install  [email protected]  --save

4. amfe-flexible をインストールする

npm install --save amfe-flexible

5. vue.config.js と同じレベルの新しい postcss.config.js を作成します。

module.exports = {
    plugins: {
      "postcss-pxtorem": {
        // 设计稿 375:37.5
        // 设计稿：750:75
        // Vant 是基于 375
        // rootValue根据设计稿宽度除以10进行设置
        rootValue: 37.5, 
        propList: ["*"]，
        selectorBlackList: ['van'] // 过滤掉VantUI组件
      }
    }
  }

vue2.0 プロジェクトは、コンポーネント Vant 2 - Vue 上に構築されたモバイル UI コンポーネントの vant2 バージョンを使用します。

npm i vant@latest-v2 -S

main.jsで導入

import Vant from 'vant';
import 'vant/lib/index.css';

Vue.use(Vant);