美文网首页
微信小程序vant

微信小程序vant

作者: ryanxun | 来源:发表于2020-06-23 12:28 被阅读0次

    进入到根目录下

    步骤一 通过 npm 安装
    需要注意的是 package.json 和 node_modules 必须在 miniprogram 目录下

    通过 npm 安装

    npm i @vant/weapp -S --production

    通过 yarn 安装

    yarn add @vant/weapp --production

    安装 0.x 版本

    npm i vant-weapp -S --production

    步骤二 构建 npm 包

    打开微信开发者工具,点击 工具 -> 构建 npm,并勾选 使用 npm 模块 选项,构建完成后,即可引入组件

    image

    步骤三 修改 tsconfig.json
    如果你使用 typescript 开发小程序,需要在 tsconfig.json 中增加如下配置,防止 npm 构建后 tsc 编译报错

    请将path/to/node_modules/@vant/weapp修改为项目中 @vant/weapp 所在的目录

    {
      "compilerOptions": {
        "baseUrl": ".",
        "paths": {
          "@vant/weapp/*": ["path/to/node_modules/@vant/weapp/dist/*"]
        }
      }
    }
    

    步骤四 修改 app.json

    将 app.json 中的 "style": "v2" 去除,小程序的新版基础组件强行加上了许多样式,难以去除,不关闭将造成部分组件样式混乱。

    相关文章

      网友评论

          本文标题:微信小程序vant

          本文链接:https://www.haomeiwen.com/subject/brocfktx.html