快速上手小程序框架Taro,安裝及使用教程(一)

前言:

這個小程序框架已經出現了很久了,而且自從微信小程序出現之後,流心觀察都可以發現,百度小程序,支付寶小程序,字節跳動小程序,QQ 小程序,京東小程序也越來越多,也越來越有用了。所以,掌握一個多端統一開發解決方案是一個很重要的事情。

介紹:

官網文檔:http://taro-docs.jd.com/taro/docs/GETTING-STARTED
GitHub地址:https://github.com/nervjs/taro
Star:27.6k

Taro 是由京東 - 凹凸實驗室打造的一套開放式跨端跨框架解決方案。支持使用 React/Vue/Nerv 等框架來開發微信/京東/百度/支付寶/字節跳動/ QQ 小程序/H5 等應用。


步驟

Taro 項目基於 node,請確保已具備較新的 node 環境(>=12.0.0)
檢查node 版本

1:安裝node

端開發框架和環境都是需要 Node.js ,先安裝node.js開發環境,vue的運行是要依賴於node的npm的管理工具來實現,下載https://nodejs.org/en/,安裝完成之後,打開cmd開始輸入命令。(我用的是win10系統,所以需要管理員權限,右鍵點擊以管理員身份運行cmd),不然會出現很多報錯。

2:查看node的版本號

下載好node之後,以管理員身份打開cmd管理工具,,輸入 node -v ,回車,查看node版本號,出現版本號則說明安裝成功。

輸入命令: node -v

3:安裝

CLI 工具安裝,打開cmd,右鍵以管理員身份運行

cnpm install -g @tarojs/cli

4:項目初始化

使用命令創建模板項目
先進入d盤,然後執行創建命令

taro init myApp

然後一路回車鍵(如果你不想使用TypeScript的話,可以在是否需要使用 TypeScript的這一行裏面選擇No)


在創建完項目之後,Taro 會默認開始安裝項目所需要的依賴,安裝使用的工具按照 yarn>cnpm>npm 順序進行檢測,一般來說,依賴安裝會比較順利,但某些情況下可能會安裝失敗,這時候你可以在項目目錄下自己使用安裝命令進行安裝

打開D盤查看一下吧,可以看見新建的項目目錄和自動安裝的依賴,我這裏是成功的喲。


如果依賴沒有自動安裝成功,那就手動輸入一下,我一般習慣使用這個命令cnpm install

5:運行

接下來的操作就是運行一下啦,Taro 需要運行不同的命令,將 Taro 代碼編譯成不同端的代碼,然後在對應的開發工具中查看效果。

我這裏是編譯成微信小程序微信小程序編譯預覽及打包,要使用的命令,是這個樣子的:

$ npm run dev:weapp
$ npm run build:weapp

首先cd進入了我的項目裏面,然後運行


這裏就成功的看到了


如果你要編譯成, 百度小程序,支付寶小程序,字節跳動小程序,QQ 小程序,京東小程序,可以直接去官方給的文檔上查看一下命令喲

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章