微信小程序 npm 引入 weui-wxss

1、打開cmd，在小程序的根目錄，初始化npm

npm init

  name 項目名稱；version 項目的版本號；description 項目的描述信息；entry point 項目的入口文件；

  test command 項目啓動時腳本命令（npm test）；git repository  Git 地址

  keywords 關鍵詞；author 作者；license 項目要發行的時候需要的證書

2、執行命令，進行安裝 npm 包

npm install --save weui-miniprogram

3、npm 進行構建

微信開發者工具==》工具（開發工具導航欄）==》構建npm

4、npm構建進行本地設置

微信開發者工具==》詳情==》本地設置==》使用npm模塊（勾選）

5、在app.wxss引入全局樣式

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

6、實例demo展示

首先在頁面的 json 文件加入 usingComponents 配置字段

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

然後可以在對應頁面的 wxml 中直接使用該組件

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