美團小程序框架 mpvue mvvm框架互通

mpvue （github 地址請參見）是一個使用 Vue.js 開發小程序的前端框架。框架基於 Vue.js 核心，mpvue 修改了 Vue.js 的 runtime 和 compiler 實現，使其可以運行在小程序環境中，從而爲小程序開發引入了整套 Vue.js 開發體驗。

主要特性：

使用 mpvue 開發小程序，你將在小程序技術體系的基礎上獲取到這樣一些能力： 
1. 徹底的組件化開發能力：提高代碼複用性 
2. 完整的 Vue.js 開發體驗 
3. 方便的 Vuex 數據管理方案：方便構建複雜應用 
4. 快捷的 webpack 構建機制：自定義構建策略、開發階段 hotReload 
5. 支持使用 npm 外部依賴 
6. 使用 Vue.js 命令行工具 vue-cli 快速初始化項目 
7. H5 代碼轉換編譯成小程序目標代碼的能力

由於mpvue基於vue而來，所以基本的結構和命令也差不多；

首先我們先下載腳手架：

cmd輸入：vue init mpvue/mpvue-quickstart test-wxapp

然後 進入我們創建的項目，並安裝依賴

cd test-wxapp
npm i

• 1
• 2
• 3

最後，在運行一下我們的開發服務

npm run dev

• 1
• 2

項目就跑起來了，這個時候，我們打開微信開發者工具，選擇小程序，然後新建一個，項目目錄填 

我們項目目錄下的dist目錄 test-wxapp/dist,就可以看到效果了

到此爲止，一個基本的項目就完成了，但是，本文的目的不是讓你學會搭一個空項目的，空項目的話，我覺得官方教程做的已經夠好了。