官方文檔：https://developers.weixin.qq....
學習小結：
1、小程序、訂閱號及服務號都是在微信公衆平臺的體系下，但小程序本身與訂閱號及服務號是完全獨立的，需要重新註冊；
2、前端常見的HTML、CSS變成了微信自定義的WXML、WXSS，官方文檔中都有明確的使用介紹，上手容易；
3、小程序與H5開發區別：
H5開發：
需要考慮使用開發工具（webstorm,vscode、sublimtext、Atom等），前端框架（Angular、react、vue、backbone等）,任務管理工具（Webpack 、Grunt、Gulp等），瀏覽器兼容性等；
小程序：
開發工具（微信開發者工具），框架（小程序框架），不能直接引入前端框架，沒有window變量，但微信提供了wx全局方法集。無法操作DOM，通過改變page data來改變視圖展現。數據綁定採用Mustache雙大括號語法。事件綁定和條件渲染，全部寫在WXML中。
4、小程序的視圖層目前使用 WebView 作爲渲染載體，而邏輯層是由獨立的 JavascriptCore 作爲運行環境。在架構上，WebView 和 JavascriptCore 都是獨立的模塊，並不具備數據直接共享的通道。當前，視圖層和邏輯層的數據傳輸，實際上通過兩邊提供的 evaluateJavascript 所實現；
5、小程序支持原生javascript嗎？
JavaScript的三大組成部分——ECMAScript、DOM（文檔對象模型，對應document對象）、BOM（瀏覽器對象模型，對應window對象）。
小程序支持ECMAScript，但不支持document，window對象。
小程序相關技術：
原生小程序開發技術棧：
1、WXML。微信標記語言，用於展示UI模板，類似HTML，文件後綴名爲“.wxml”。
2、WXSS。WeiXin Style Sheets，用於規定UI樣式，具有 CSS 大部分特性。在CSS基礎上擴展了尺寸單位和樣式導入。文件後綴名爲“.wxss”
3、WXS。WeiXin Script。封裝後的JS，一般內嵌於WXML頁面，很方便構建頁面，標籤爲”<wxs></wxs>"。
4、JS。普通的JavaScript，常用於控制整個頁面的邏輯。後綴名爲“.js”
5、JSON。用於項目全局配置或單頁面配置，後綴名爲“.json”。
開源框架：
1、WePY。是騰訊開源的一套語法接近vue.js，快速開發小程序的框架，微信組件化框架，類Vue.js風格，讓Web App的開發者更容易開發小程序。類Vue.js風格；支持引入NPM包、組件化開發、ES2015+特性、Promise、多種編譯器(Less/Sass/Stylus/PostCSS、Babel/Typescript、Pug)等。
2、mpvue。使用 Vue.js 開發小程序的前端框架，美團點評團隊出品。在最理想的狀態是，可以一套代碼可以直接跑在多端：WEB、小程序（微信和支付寶）、Native（藉助weex）。使用該框架，Vue開發者幾乎可以無縫開發小程序。
服務端通訊：
1、Flyio。強大的http請求庫；微信小程序的 javascript 運行環境和瀏覽器不同，頁面的腳本邏輯 是在JsCore中運行，JsCore是一個沒有窗口對象的環境，所以不能在腳本中使用window，也無法在腳本中操作組件，
JsCore中也沒有 XmlhttpRequest對象，所以jquery 、zepto、axios這些在小程序中 都不能用，而此時，正是 fly 大顯身手的時候。
UI框架：
1、WeUI 是一套同微信原生視覺體驗一致的基礎樣式庫，由微信官方設計團隊爲微信內網頁和微信小程序量身設計，令用戶的使用感知更加統一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。
2、mpvue-weui 基於 mpvue 框架，重寫 WeUI，基於小程序原生組件，mpvue 完美支持；快捷開發，只需引入 weui.css
賽宜居2.0技術棧：
1、框架：mpvue;
2、UI組件庫:mpvue-weui;
3、服務端通訊：Fly.js;
項目搭建：
- 先檢查下 Node.js 是否安裝成功（如沒有需要自己去安裝）
$ node -v
$ npm -v
- 全局安裝 vue-cli
$ npm install --global vue-cli
- 創建一個基於 mpvue-quickstart 模板的新項目 project
$ vue init mpvue/mpvue-quickstart project
- 安裝依賴
$ cd project
$ npm install
$ npm run dev
隨着運行成功的回顯之後，可以看到本地多了個 dist 目錄，這個目錄裏就是生成的小程序相關代碼。
在微信開發者工具中打開文件（目錄：projectdistwx）看效果：
用vcode（自己趁手的編輯器或者IDE）打開 project 中的 src 目錄下的代碼試試，src中的改動，會實時編譯到微信開發者工具中打開文件中，可以看到實時效果（注意：新增的頁面需要重新 npm run dev 來進行編譯）
mpvue框架構建小程序項目的demo完畢
以後就在src目錄下進行賽宜居2.0小程序開發
引入mpvue-weui;
在static目錄下自己新建/weui/weui.css（https://github.com/KuangPF/mp...）
main.js文件下import引入weui.css：
import '../static/weui/weui.css'
引入Fly.js;
使用npm安裝fly.js：
$ npm install flyio
引入：
var Fly=require("flyio/dist/npm/wx") ;//npm引入方式
var fly=new Fly(); //創建fly實例
後續再封裝
添加scss支持：
npm i sass-loader node-sass --save-dev
<style lang="scss" scoped> // 注意：增加scoped屬性的作用是限定當前組件樣式的作用域僅作用域當前組件
$color: #417ccc;
.page {
background: $color;
}
</style>