npm引入小程序官方WeUI组件库weui-miniprogram

一，查看是否安装npm包

通过npm -v 查看npm的版本，如果能显示相应出版本号，就说明是安装成功的。

二，如果没有安装

1.npm init 会提示不是内部命令

2.安装node环境

这时候就需要安装node环境，可以在http://nodejs.cn/download/ 下载对应的版本

三，开始构建nmp

1.进入小程序根目录（app.js所在目录），打开cmd

输入：npm init -y

npm init -y

参数 -y 表示对 npm 要求提供的信息，都自动按下回车键，表示接受默认值。

2.下载依赖

npm install weui-miniprogram

下载miniprogram依赖

四，点击 微信开发者工具的 工具=>构建npm

五，app.wxss引入全局样式

@import './miniprogram_npm/weui-miniprogram/weui-wxss/dist/style/weui.wxss';

列：在页面中引入 dialog 弹窗组件

1.首先在页面的 json 文件加入 usingComponents 配置字段

{
  "usingComponents": {
    "mp-dialog": "/miniprogram_npm/weui-miniprogram/dialog/dialog"
  }
}

2.然后可以在对应页面的 wxml 中直接使用该组件

<mp-dialog title="test" show="{{true}}" bindbuttontap="tapDialogButton" buttons="{{[{text: '取消'}, {text: '确认'}]}}">
    <view>test content</view>
</mp-dialog>