miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目)

这篇具有很好参考价值的文章主要介绍了miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目)。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

小程序分类:uni-app
qq小程序 支付宝小程序 百度小程序 钉钉小程序 微信小程序 小程序转成uni_app 小程序转为uni_app 小程序转uni_app 小程序转换
工具现在支持npm全局库、HBuilderX插件两种方式使用,任君选择,HBuilderX插件地址:https://ext.dcloud.net.cn/plugin?id=2656

一、它是谁?

【miniprogram-to-uniapp】转换微信小程序”项目为uni-app项目(新版本工具已经支持各种小程序转换)。

二、它的原理是什么?

最初是学了半节课堆和栈,觉得词法分析挺有意思的,再加上转换小程序插件时,发现这些繁琐的操作完全可以使用程序来完成。
核心是使用Babel获取AST(词法分析),然后或使用Babel自带函数增删,或正则分析替换等等操作。
可能有的朋友觉得,这种为啥不是纯正则分析? 纯正则可以解决一部分问题,对于标签与标签内容,其实正则是很难进行区分的哈。

三、它能做哪些事情?

支持微信、QQ、头条/抖音、支付宝/钉钉和百度等小程序转换到 uni-app 项目
支持有/无云开发的小程序项目转换为 uni-app 项目(cloudfunctions 目录将被忽略,uni-app 结合小程序云开发见:使用 uni-app 进行微信小程序云开发经验分享)
支持解析 TypeScript 小程序项目
支持解析使用 npm 模块的小程序项目
支持解析 include 标签
支持解析 template 标签
支持解析 Behavior 文件为 mixins 文件
支持.js’, .wxml 和*.wxss 文件进行相应转换,并做了大量的优化
支持识别 App、Page、Component、VantComponent、Behavior 和纯 Javascript 文件的转换
修复变量名与函数重名的情况
合并使用 require 导入的 wxs 文件
setData() polyfill
搜索未在 data 声明,而直接在 setData()里使用的变量,并修复
使用jyf-parser替换 wxParse(感谢网友 “爱瑞巴勒康忙北鼻” 的建议)
因 uni-app 会将所有非 static 目录的资源文件删除,因此将所有资源文件移入 static 目录,并修复所有能修复到的路径(目前 uni 编译时会将非 static 目录的文件复制一份到 static 目录,但并不完全,因此本功能仍保留)

四、它还有哪些不支持转换?

不支持转换反编译后的小程序项目
不支持转换使用 uni-app 编译的小程序项目
不支持转换使用 redux 开发的小程序(代表为:网易云信小程序 DEMO)
不支持转换使用 wxpage 开发的小程序(https://github.com/tvfe/wxpage)
不支持转换使用腾讯 omi 开发的小程序(https://github.com/Tencent/omi)
不支持转换小程序抽象节点 componentGenerics
不支持 component 里的 pageLifetimes 生命周期,请手动绕过
不支持使用 js 系统关键字作为函数或变量名(如 default、import、return、switch 等)
不支持以$开头的变量名称,如 Page({data:{$data:{name:“hello”}}}) ,刚好$data 是 vue 内置变量,so 不支持,需手动修复
不支持以动态绑定的函数<input @input=“test{{index+1}}”>,需手动修复
更多,请参照miniprogram to uniapp 工具答疑

五、怎么使用?

第一步

在命令行里,运行【 npm install miniprogram-to-uniapp -g 】进行安装,因为这个包是工具,要求全局都能使用,所以需要-g进行全局安装。

 npm install miniprogram-to-uniapp -g 

如果运行npm报错,请先安装Node.js,下载地址:https://nodejs.org/zh-cn/

第二步

继续在命令行里,运行【 wtu -V 】,执行结果如下:

 wtu -V

显示版本号,说明已经安装成功了。(wtu -> 取自wx to uni之意,后面都用这个全局命令)

第三步

在命令行里,输入【wtu -i “你的小程序项目路径”】
注意 -i 前面和后面都有空格!!!
注意 -i 前面和后面都有空格!!!
注意 -i 前面和后面都有空格!!!

如:【wtu -i “E:\zpWork\Project_self\miniprogram-to-uniapp\test\test-wx-to-uni”】 ,回车后即可以在源项目同及目录得到一个后缀为_uni的目录,即转换成功。

wtu -i "E:\zpWork\Project_self\miniprogram-to-uniapp\test\test-wx-to-uni"

转换前:
miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目),小程序,uni-app,微信小程序

转换后:
miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目),小程序,uni-app,微信小程序

转换后的项目文件对比(左边是小程序项目,右边是Uni-app项目目录):
miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目),小程序,uni-app,微信小程序

第四步

将转换后的xxx_uni项目导入到hbuilder X,
点击菜单 运行–> 运行到小程序模拟器–>微信开发者工具!(如果是使用了vant的项目,请运行到H5,vant项目转换后仅支持H5和app)
点击菜单 运行–> 运行到小程序模拟器–>微信开发者工具!(如果是使用了vant的项目,请运行到H5,vant项目转换后仅支持H5和app)
点击菜单 运行–> 运行到小程序模拟器–>微信开发者工具!(如果是使用了vant的项目,请运行到H5,vant项目转换后仅支持H5和app)
重要的话说三遍!

然后查看转换后的项目运行到小程序,是否可以正常运行无报错!
(因为这种转换非100%,所以至少需要保证 小程序–>uniapp–>小程序仍然能正常运行,再考虑运行到其他小程序或app),
如有报错,请根据miniprogram to uniapp 工具答疑 进行修改,保证无报错,然后再运行到其他平台。

转换工具下载地址:
https://download.csdn.net/download/weixin_43025151/87642314文章来源地址https://www.toymoban.com/news/detail-720671.html

到了这里,关于miniprogram-to-uniapp使用指南(各种小程序项目转换为uni-app项目)的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • Jmeter进阶使用指南-使用断言

    Apache JMeter是一个流行的开源负载和性能测试工具。在JMeter中,断言(Assertions)是用来验证响应数据是否符合预期的一个重要组件。它是对请求响应的一种检查,如果响应不符合预期,那么断言会标记为失败。 以下是如何在JMeter中使用断言的基本步骤: 添加断言 :首先,你

    2024年02月09日
    浏览(45)
  • Github的使用指南

    打开giuhub官网,右上角点击你的头像,随后点击 your repositories 点击New开始创建仓库 如下图为创建仓库的选项解释 出现如下界面就可以进行后续的git指令操作了 进入需上传项目的所在目录,打开git命令行,输入如下命令开始初始化git仓库,这将在你的项目文件夹中创建一个名

    2024年02月12日
    浏览(37)
  • CuteHttpFileSever使用指南

    浏览器访问,多端互通 局域网传输,速度很快 官方网址 我下载时比较慢,好在文件不大 个人蓝奏云网址 文件提取码:1lqd 官网下载说明 官网页面见下图 1 是windows内的安装包,根据自己电脑配置选择 2 是图形化界面的软件 以上两种选其一即可 图形化界面使用教程 双击图形

    2024年02月05日
    浏览(35)
  • Matlab使用指南

    zcy 2.1 数据类型 matlab中有15种基本数据类型,每种数据类型均以数组/矩阵的形式出现 整数 matlab支持1、2、4、8字节的有符号整数和无符号整数 浮点数 有单精度和双精度两种浮点数 复数 复数包含实部和虚部,可以用i或者j来表示虚部 2.2 基本矩阵操作 2.2.1 矩阵的构造 2.2.2 矩阵

    2024年02月06日
    浏览(47)
  • Vim深入使用指南

    Vim是一款功能强大的文本编辑器,被广泛用于编写和编辑各种类型的文档和代码。 可以操作系统下载并安装Vim。在安装完成后,通过在终端中输入 vim 命令来启动Vim。 Vim有多个工作模式,每个模式有不同的功能和快捷键。以下是Vim的三个基本模式: 命令模式(Command mode) :

    2024年02月15日
    浏览(37)
  • mac使用指南

    新公司给配备了mac,可惜土鳖的我不会用,所以特地写了一篇文章记录学习mac的过程 删除:command+delete 光标移至最右/左:command+右/左箭头 截图:command+shift+3/4/5,3代表截全屏,4代表选中截图,5代表可编辑截图 关闭单个窗口:command+w 关闭程序并结束进程:command+q 切换输入法

    2024年02月07日
    浏览(36)
  • chtagpt使用指南

    ChatGPT是一款基于GPT-3.5架构的大型语言模型,它可以进行多种自然语言处理任务,如文本生成、对话生成、文本分类等。在本文中,我将为您提供一份详细的ChatGPT使用指南,帮助您更好地了解和使用ChatGPT。 要使用ChatGPT,您需要首先创建一个OpenAI账户并登录。创建账户后,您

    2023年04月17日
    浏览(36)
  • sqlx库使用指南

    sqlx库使用指南 在项目中我们通常可能会使用database/sql连接MySQL数据库。本文借助使用sqlx实现批量插入数据的例子,介绍了sqlx中可能被你忽视了的sqlx.In和DB.NamedExec方法。 sqlx介绍 在项目中我们通常可能会使用database/sql连接MySQL数据库。sqlx可以认为是Go语言内置database/sql的超集

    2024年02月09日
    浏览(39)
  • JMockit 使用指南

    本文主要内容 如何在 SpringBoot 中配置使用 JMockit 如何 mock / faking 依赖的对象 如何对行为 mock 如何 Verification JMockit 之所以强大,是因其使用了 javaagent 对类的字节码做了修改,在 JVM 的所有 mock 工具中,它是功能最强大的。同时注解又是最少的。 在 SpringBoot 项目中使用 JMocki

    2023年04月08日
    浏览(38)
  • ILRuntime使用指南

    前言 最近闲着没事做,于是用ILRuntime做了一个小游戏 中间遇到一些坑,对于ILRuntime的认识更清楚了。 其它技巧 自动转换DLL 设置引用文件夹 我们在热更项目里面写代码的时候需要用到Unity的DLL,可是这些DLL引用起来查找就很麻烦。 这时候可以设置文件夹 编辑器就会自动提示

    2023年04月27日
    浏览(35)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包