小程序api地址:https://developers.weixin.qq.com/miniprogram/dev/api/
mpvue-weui(常用地址):https://kuangpf.com/mpvue-weui/#/README
mpvue 官方文檔: http://mpvue.com/mpvue/quickstart/#2
mpvue是新出的用vue的語法開發微信小程序的前端框架,經過實際開發還是比較好用的。最大的特點是,對於先開發vue項目,後開發該項目的小程序版本來說機具便利。
1. 初始化一個 mpvue 項目
現代前端開發框架和環境都是需要 Node.js 的,如果沒有的話,請先下載 nodejs 並安裝。
然後打開命令行工具:
# 1. 先檢查下 Node.js 是否安裝成功
$ node -v
v8.9.0
$ npm -v
5.6.0
# 2. 由於衆所周知的原因,可以考慮切換源爲 taobao 源
$ npm set registry https://registry.npm.taobao.org/
# 3. 全局安裝 vue-cli
# 一般是要 sudo 權限的
$ npm install --global [email protected]
# 4. 創建一個基於 mpvue-quickstart 模板的新項目
# 一路回車選擇默認就可以了
# 注意:在是否選擇eslint的地方,打n,回車,表示不用eslint嚴格語法
$ vue init mpvue/mpvue-quickstart my-project
# 5. 安裝依賴,走你
$ cd my-project
$ npm install
$ npm run dev
2.安裝微信開發者工具,新建項目的地址就是就是剛剛創建的項目目錄(非 dist 目錄)
3.到此,上手完畢。
注意:新增的頁面需要重新 npm run dev
來進行編譯