weapp 构建小程序

1、打开微信开发者工具

2、新建项目,选择小程序

3、构建好项目之后:

        在工具右上角点击详情按钮,打开项目的配置:选择本地设置

                勾选es5 和使用npm模块构建

4、在终端进入项目根目录:

        执行npm init 命令对项目初始化数据进行基本的设置

5、安装weapp:

        npm i @vant/weapp -S --production

6、修改挨app.json

        去掉:  "style": "v2"

7、修改project.config.json:

  

{

  "setting": {

    "packNpmManually": true,
    "packNpmRelationList": [
      {
        "packageJsonPath": "./package.json",
        "miniprogramNpmDistDir": "./"
      }
    ]
  }
}

    

8、工具构建: 工具——》构建npm。 完成项目的构建

9、测试:

   在app.json中配置测试组件:

   "usingComponents": { "van-button": "@vant/weapp/button/index" }

        在index.wxml中配置

        <van-button type="primary">按钮</van-button>

刷新页面,如果有按钮显示出来标明使用weapp成功

猜你喜欢

转载自blog.csdn.net/qq_31319235/article/details/120782029