如果你是使用 NPM 安裝叁幢,使用如下命令:
$ npm install -g @tarojs/cli
如果你是使用 Yarn 安裝滤灯,使用如下命令:
$ yarn global add @tarojs/cli
安裝完畢,測(cè)試一下是否安裝成功:
如你所見(jiàn)曼玩,版本號(hào)打印出來(lái)鳞骤,說(shuō)明已經(jīng)安裝好了。
使用命令創(chuàng)建模板項(xiàng)目:
$ taro init myApp
NPM 5.2+ 也可在不全局安裝的情況下使用 npx 創(chuàng)建模板項(xiàng)目:
$ npx @tarojs/cli init myApp
命令行上會(huì)提示 Taro 即將創(chuàng)建一個(gè)新項(xiàng)目!黍判,接著 Taro 會(huì)提示你輸入項(xiàng)目介紹豫尽,我們這里輸入 我的第一個(gè) Taro 項(xiàng)目;而后讓你選擇是否使用 TypeScript顷帖,筆者不使用 TypeScript 美旧,輸入 n ; 接著提供 CSS 預(yù)處理器選擇,有 Sass贬墩、Less榴嗅、Seyless,筆者選擇了 Sass陶舞;然后是選擇模板嗽测,筆者選擇默認(rèn)模版,完成后肿孵,Taro 開(kāi)始創(chuàng)建項(xiàng)目唠粥,自動(dòng)安裝依賴(lài),這里可能需要等待一會(huì)停做。
看到提示 請(qǐng)進(jìn)入項(xiàng)目目錄 myApp 開(kāi)始工作吧 后厅贪,進(jìn)入項(xiàng)目目錄開(kāi)始開(kāi)發(fā),目前 Taro 已經(jīng)支持微信/百度/支付寶小程序雅宾、H5 以及 ReactNative 等端的代碼轉(zhuǎn)換,針對(duì)不同端的啟動(dòng)以及預(yù)覽葵硕、打包方式并不一致眉抬。
微信小程序
選擇微信小程序模式,需要自行下載并打開(kāi)微信開(kāi)發(fā)者工具懈凹,然后選擇項(xiàng)目根目錄進(jìn)行預(yù)覽蜀变。具體安裝的方法和使用請(qǐng)參考第 3 章《微信小程序開(kāi)發(fā)入門(mén)與技術(shù)選型》里的 「微信小程序開(kāi)發(fā)入門(mén)」。
微信小程序編譯預(yù)覽及打包:
# npm script
$ npm run dev:weapp
$ npm run build:weapp
# 僅限全局安裝
$ taro build --type weapp --watch
$ taro build --type weapp
# npx 用戶(hù)也可以使用
$ npx taro build --type weapp --watch
$ npx taro build --type weapp
百度小程序
選擇百度小程序模式介评,需要自行下載并打開(kāi)百度開(kāi)發(fā)者工具库北,然后在項(xiàng)目編譯完后選擇項(xiàng)目根目錄下 dist
目錄進(jìn)行預(yù)覽爬舰。
百度小程序編譯預(yù)覽及打包:
# npm script
$ npm run dev:swan
$ npm run build:swan
# 僅限全局安裝
$ taro build --type swan --watch
$ taro build --type swan
# npx 用戶(hù)也可以使用
$ npx taro build --type swan --watch
$ npx taro build --type swan
支付寶小程序
選擇支付寶小程序模式,需要自行下載并打開(kāi)支付寶小程序開(kāi)發(fā)者工具寒瓦,然后在項(xiàng)目編譯完后選擇項(xiàng)目根目錄下 dist
目錄進(jìn)行預(yù)覽情屹。
支付寶小程序編譯預(yù)覽及打包:
# npm script
$ npm run dev:alipay
$ npm run build:alipay
# 僅限全局安裝
$ taro build --type alipay --watch
$ taro build --type alipay
# npx 用戶(hù)也可以使用
$ npx taro build --type alipay --watch
$ npx taro build --type alipay
H5
H5 模式,無(wú)需特定的開(kāi)發(fā)者工具杂腰,在執(zhí)行完下述命令之后即可通過(guò)瀏覽器進(jìn)行預(yù)覽垃你。
H5 編譯預(yù)覽及打包:
# npm script
$ npm run dev:h5
# 僅限全局安裝
$ taro build --type h5 --watch
# npx 用戶(hù)也可以使用
$ npx taro build --type h5 --watch
React Native
React Native 端運(yùn)行需執(zhí)行如下命令,React Native 端相關(guān)的運(yùn)行說(shuō)明請(qǐng)參見(jiàn) React Native 教程喂很。
# npm script
$ npm run dev:rn
# 僅限全局安裝
$ taro build --type rn --watch
# npx 用戶(hù)也可以使用
$ npx taro build --type rn --watch
更新 Taro
Taro 提供了更新命令來(lái)更新 CLI 工具自身和項(xiàng)目中 Taro 相關(guān)的依賴(lài)惜颇。
更新 taro-cli 工具:
# taro
$ taro update self
# npm
npm i -g @tarojs/cli@latest
# yarn
yarn global add @tarojs/cli@latest
更新項(xiàng)目中 Taro 相關(guān)的依賴(lài),這個(gè)需要在你的項(xiàng)目下執(zhí)行少辣。
$ taro update project