01-Taro打造hello-world應用
01-Taro打造hello-world應用
一、簡介
Taro是由京東凹凸實驗室出品,書寫一套代碼通過 Taro 的編譯工具,將源代碼分別編譯出可以在不同端(微信 / 京東 / 百度 / 支付寶 / 位元組跳動 小程序、快應用、H5、React-Native 等)運行的代碼。廢話不多說,先從hello-world開始吧。
二、搭建環境
// node>=8.0.0
npm install -g @tarojs/cli
taro -v
taro init taroDemo
不好意思我果斷control+z
cd taroDemo
yarn
安裝依賴成功後咱先體驗一把weapp、alipay、h5的效果
三、小試牛刀
// dev 開發 build 生產
yarn dev:weapp // 微信小程序
yarn dev:alipay // 支付寶小程序
yarn dev:h5
以微信小程序為例
cd taroDemo
yarn dev:weapp
// 打開微信開發工具 導入dist目錄
如果想生成支付寶小程序則control+z 再 yarn dev:alipay, 生成的dist目錄就是支付寶小程序了
四、項目結構
五、多端同步調試
在config/index.js
配置
outputRoot: `dist/${process.env.TARO_ENV}`
在終端打開多個Tab,分別運行
yarn dev:weapp
yarn dev:alipay
編譯出來的目錄如圖,dist
目錄下有 weapp
和 alipay
兩個目錄