您好,登錄后才能下訂單哦!
使用Labrador框架可以使微信開發者工具支持加載海量NPM包
支持ES6/7標準代碼,使用async/await能夠有效避免回調地獄
組件重用,對微信小程序框架進行了二次封裝,實現了組件重用和嵌套
自動化測試,非常容易編寫單元測試腳本,不經任何額外配置即可自動化測試
使用Editor Config及ESLint標準化代碼風格,方便團隊協作
首先您的系統中安裝Node.js和npm v3 下載Node.js,然后運行下面的命令將全局安裝Labrador命令行工具。
npm install -g labrador-cli
mkdir demo # 新建目錄 cd demo # 跳轉目錄 npm init # 初始化npm包 labrador init # 初始化labrador項目
demo # 項目根目錄├── .labrador # Labrador項目配置文件├── .babelrc # babel配置文件├── .editorconfig # Editor Config├── .eslintignore # ESLint 忽略配置├── .eslintrc # ESLint 語法檢查配置├── package.json ├── dist/ # 目標目錄├── node_modules/ └── src/ # 源碼目錄 ├── app.js ├── app.json ├── app.less ├── components/ # 通用組件目錄 ├── pages/ # 頁面目錄 └── utils/
注意 dist目錄中的所有文件是由labrador命令編譯生成,請勿直接修改
項目初始化后使用WebStorm或Sublime等你習慣的IDE打開項目根目錄。然后打開 微信web開發者工具 新建項目,本地開發目錄選擇 dist
目標目錄。
在WebStorm或Sublime等IDE中編輯 src
目錄下的源碼,然后在項目根目錄中運行labrador build
命令構建項目,然后在微信web開發者工具 的調試界面中點擊左側菜單的 重啟 按鈕即可查看效果。
我們在開發中, 微信web開發者工具 僅僅用來做調試和預覽,不要在 微信web開發者工具 的編輯界面修改代碼。
微信web開發者工具 會偶爾出錯,表現為點擊 重啟 按鈕沒有反應,調試控制臺輸出大量的無法require文件的錯誤,編輯界面中代碼文件不顯示。這是因為
labrador build
命令會更新整個dist
目錄,而 微信web開發者工具 在監測代碼改變時會出現異常,遇到這種情況只需要關掉 微信web開發者工具 再啟動即可。
我們還可以使用 labrador watch
命令來監控 src
目錄下的代碼,當發生改變后自動構建,不用每一次編輯代碼后手動運行labrador build
。
所以最佳的姿勢是:
在項目中運行 labrador watch
在WebStorm中編碼,保存
切換到 微信web開發者工具 中調試、預覽
再回到WebStorm中編碼
...
未完,待續...
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。