了解Taro

聽說Taro是從幾個星期前開始的，在一次飯桌上，一個小伙伴說：“Hey， 你聽說了Taro么，聽說只需要寫一套程序就可以生成H5，小程序以及RN的代碼模板，并且類似于React的語法。”“哦？還有這么好的事，趕緊研究一下。”

Taro初體驗

去官網，Github了解了一下，Taro是由京東·凹凸實驗室團隊開發的，在掘金上看到他們的發稿，大致歸(tu)納(cao)如下：

代碼組織與語法：微信小程序需要在js/wxss/wxml/json文件中來回切換

命名規范：微信文檔中的各種命名規范(駝峰、小寫中劃線、小寫連寫)，慘不忍睹

開發方式：不能加載npm包，不能使用Sass/less等預處理器以及手動的文件處理

使用Taro

跑去官網，按照步驟，copy了demo運行了一下，大致如下：

npm install -g @tarojs/cli

taro init myApp

# H5端運行

$ npm run dev:h5

$ taro build --type h5 --watch

# 微信小程序端運行

$ npm run dev:weapp

$ taro build --type weapp --watch

起步在這里：Get Started，大致這樣就可以跑起來了，分別在瀏覽器和微信開發工具中運行了一下，都可以看到界面輸出，感覺還是不錯。

Taro語法

Taro的開發語法遵循React，基本上寫過React的都是很好上手。大致是這個樣子的：

import Taro, { Component } from '@tarojs/taro'

import Index from './pages/index'

import './app.scss'

class App extends Component {

// 項目配置

config = {

pages: [

'pages/index/index'

],

window: {

backgroundTextStyle: 'light',

navigationBarBackgroundColor: '#fff',

navigationBarTitleText: 'WeChat',

navigationBarTextStyle: 'black'

}

}

componentWillMount () {}

componentDidMount () {}

componentDidShow () {}

componentDidHide () {}

render () {

return (

)

}

}

Taro感受

以下是我自己個人的感受，因為還沒有在項目中應用，可能有些地方說得不太妥當，還望指出。

一端開發，多端生成

正如Taro自己所說的，只需要寫一個版本的代碼，就可以編譯生成H5、微信小程序以及RN的代碼，在效率上確實會有所提升。

Non-Reacter的學習成本

如果作為一個'Reacter'，那么用Taro來開發項目的話肯定是沒什么上手難度的，但是如果是沒有寫過react項目的，那么可能最開始還是有學習成本。

文檔開發還有欠缺

對比了微信小程序官網和Taro的Gitbook文檔，大致上很多東西都是一一對應的，基本的許多場景都可以滿足，但是也有欠缺。比如：組件中的RichText在Taro中就介紹不足，在Taro中(可能_)和微信小程序中分別是這樣調用的：

// Taro

// 微信小程序

文檔中缺乏了nodes以及onTap方法的說明，這可能需要開發者自己調試。但實際上我按照微信小程序的方法加上onTap之后，控制臺是報方法未定義的錯誤，而實際上我是有寫的。【這點要是在實際開發中可能欲哭無淚，要么就是引入其他的庫或者自己手寫，無疑會增加開發成本以及風險】。

有人或許想說，我直接在生成的微信小程序代碼文件夾(dist)中加上不就可以了，但是你可能不是太好改，因為代碼是這樣的：

建議與總結

如果你的項目足夠下，并且沒有運用到特別復雜的組件，并且有開發多端代碼的需要，你可以嘗試使用Taro，因為即使你需要的組件沒有，也可以在有限的時間內方便地寫出來，而且京東商城小程序貌似也是用Taro寫的，以后應該會有更多的支持。除此之外，暫時可以先觀望觀望 O(∩_∩)O哈哈~

總結

以上是生活随笔為你收集整理的taro 重新加载小程序_Taro开发微信小程序的初体验的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。