環(huán)境

系統(tǒng)：windows

開發(fā)工具：微信開發(fā)工具RC V1.02.1907301 + vscode

微信基礎(chǔ)庫版本：2.8.1

Taro：v1.3.15

npm: 6.4.1

node: v8.12.0

微信小程序代碼轉(zhuǎn)Taro

這里我使用了一個簡單的垃圾答題小程序來嘗試，其中使用了自定義組件，以及自定義導(dǎo)航欄，未使用分包等其他特性，確保項目是正常，轉(zhuǎn)換前玩了下，沒有任何報錯等問題。

在小程序項目目錄下執(zhí)行 `taro convert`

一切都順利，第一步成功。

在項目目錄下會出現(xiàn)一個taroConvert目錄，里面為轉(zhuǎn)換后的代碼

既然轉(zhuǎn)成taro代碼了，那么就可以編譯成其他平臺小程序了，于是我開始嘗試

編譯成微信小程序

1.安裝依賴:

在taroConvert目錄下執(zhí)行 npm install 我使用的是cnpm

沒有報錯。

2.編譯運行

npm run dev:weapp --watch

出現(xiàn)一個警告 變量沖突

好吧，找到game.js文件，發(fā)現(xiàn)全局的index 和 render函數(shù)中for循環(huán)index沖突了

修改成i，其實這個變量沒有用到，是可以直接移除

3.編譯成功

再次編譯后成功，打開微信開放工具導(dǎo)入項目，注意是導(dǎo)入taroConvert下的dist目錄

出現(xiàn)問題

1.regeneratorRuntime is not defined

1.解決方案：

因為代碼中使用了async await 語法，需要安裝插件來支持

安裝 npm install babel-plugin-transform-runtime

在config/index.js中引入插件

2.sitemap.json 未找到

添加到dist文件下，或者移除該配置，我暫時用不上，所以移除了，在app.js下

3.scene 未定義

這個就比較坑了，在componentDidShow下不能獲取n對象

只好自己增加onShow生命周期

4.success屬性未定義

原因是我在state中定義了questions: {} 而render函數(shù)中使用了questions.current.success導(dǎo)致報錯，加上默認(rèn)值即可

控制臺終于不紅了

5.wxml報錯了 style屬性出問題了

定位到對應(yīng)代碼

修改后

終于編譯成功了

6.app下的屬性無法獲取,需要放到globalData下

修改后,對應(yīng)的引用都需要修改

展示正常

7.triggerEvent無效

由于微信自定組件使用了triggerEvent,taro并沒有轉(zhuǎn)換成功

自行改成react 的組件通信方式

修改完以上內(nèi)容，完美運行了。

轉(zhuǎn)H5

報錯

轉(zhuǎn)百度小程序

大部分布局都沒什么問題，由于沒有appid就沒有驗證是否能正常運行

轉(zhuǎn)支付寶小程序

也是存在很多問題，布局錯亂

轉(zhuǎn)RN

編譯不能通過

大部分css代碼都需要調(diào)整

總結(jié)

很顯然，想要將微信小程序通過轉(zhuǎn)成taro再編譯成多端開發(fā)坑還是很多，我選擇狗帶

總結(jié)

以上是生活随笔為你收集整理的taro 小程序转h5之后报错_记录微信小程序转Taro中遇到的问题的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。