部署wepy框架開發微信小程序

我用的是yarn，如果你使用的是npm，也可以

首先需要安裝wepy命令行工具

npm install wepy-cli -g

然后在選定的位置使用腳手架工具創建wepy項目

wepy init standard yy-cabinet

PS C:\Users\gushi\Desktop> wepy init standard yy-cabinet
? Project name yy-cabinet
? Project description 研一智能葯劑櫃微信小程序項目
? Author gstoken <[e-mail]>
? Use ESLint to lint your code? No
? Use Redux in your project? Yes
? Use web transform feature in your project? Yes

   wepy-cli · Generated "yy-cabinet".

接着安裝依賴包

yarn install

依賴包安裝完成之后就可以嘗試build了

wepy build
wepy build --watch //這樣做可以監視文件變化自動組件

編譯之后會出現dist目錄

使用微信web開發者工具打開該目錄

 

 

重要提醒

1. 使用微信開發者工具-->添加項目，項目目錄請選擇dist目錄。

2. 微信開發者工具-->項目-->關閉ES6轉ES5。 重要：漏掉此項會運行報錯。

3. 微信開發者工具-->項目-->關閉上傳代碼時樣式自動補全。 重要：某些情況下漏掉此項也會運行報錯。

4. 微信開發者工具-->項目-->關閉代碼壓縮上傳。 重要：開啟后，會導致真機computed, props.sync 等等屬性失效。（注：壓縮功能可使用WePY提供的build指令代替，詳見后文相關介紹以及Demo項目根目錄中的wepy.config.js和package.json文件。）

5. 本地項目根目錄運行wepy build --watch，開啟實時編譯。（注：如果同時在微信開發者工具-->設置-->編輯器中勾選了文件保存時自動編譯小程序，將可以實時預覽，非常方便。）

 

 

 

然后要手動啟用Promise

在1.4.1以下版本，wepy生成的項目默認都會加入promise polyfill。

在1.4.1以后的版本，需要用戶手動加入，具體方法如下：

yarn add promise-polyfill

//在app.wpy中引入polyfill
import Promise from 'promise-polyfill'; 
//在app.wpy中使API promise化
export default class extends wepy.app {

    constructor () {
        super();
        this.use('promisify');
    }

 然后安裝weui-wxss界面框架

yarn add weui-wxss

 然后在app.wpy里面引入

@import url("../node_modules/weui-wxss/dist/app.wxss");