最近公司有個(gè)需求,原諒我是小白,第一次遇到,把原生的微信小程序代碼轉(zhuǎn)換為uni-app項(xiàng)目,我在百度了下,有人說:要把微信小程序的代碼復(fù)制到uniapp項(xiàng)目中進(jìn)行編譯,我想了想太麻煩,思索著肯定有工具來幫我實(shí)現(xiàn)
工具:miniprogram-to-uniapp
在轉(zhuǎn)換的過程中,這個(gè)工具做了什么?
- 解析并合并 [xx.js, xx.wxml, xx.wxss] 為 xx.vue 文件跟啤，并對(duì)小程序模板語法進(jìn)行轉(zhuǎn)換放航，調(diào)整生命周期函數(shù)抒和，this.setData()轉(zhuǎn)換等骗绕；
- 將所有素材資源移入到static目錄，并修復(fù)路徑
- 轉(zhuǎn)換<template/>標(biāo)簽和語法import *.wxml的轉(zhuǎn)換
- 支持workers目錄轉(zhuǎn)換
- 支持wxs文件轉(zhuǎn)換
- 解析小程序的json配置文件盒犹，并組裝好uni-app需要的配置文件檐什，生成項(xiàng)目漾峡。
如何使用?
在命令行cmd輸入,加-g是因?yàn)檫@個(gè)包是全局的
npm install miniprogram-to-uniapp -g
安裝完成之后輸入命令,可以查看是否安裝成功,出現(xiàn)版本號(hào)
snipaste_20200502_201147.png
為什么這個(gè)命令要叫wtu呢?
wx to uni
可以這樣理解
然后在命令行輸入wtu -i (-i左右都要空格)在后面輸入你微信小程序的路徑
snipaste_20200502_201615.png
然后進(jìn)行轉(zhuǎn)換
snipaste_20200502_201700.png
轉(zhuǎn)換成功
snipaste_20200502_202001.png
工具升級(jí)
因?yàn)楣ぞ吒卤容^頻繁痪蝇，安裝后鄙陡，可以使用如下命令進(jìn)行升級(jí)：
npm update miniprogram-to-uniapp -g
