如何将各种小程序(微信小程序)项目转换为 uni-app 项目

news2024/11/16 19:27:10

使用【miniprogram-to-uniapp】可以将微信小程序项目转为 uni-app 项目(新版本 HBuilderX 工具已经支持各种小程序转换插件)

HBuilderX 插件地址:miniprogram-to-uniapp v2 - DCloud 插件市场

核心原理:使用 Babel 获取AST(词法分析),然后或使用 Babel 自带函数增删,或正则分析替换等等操作

支持的事件

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

不支持的转换

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

使用方法

第一步

win + R 在命令行里,运行【 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 后面要使用双引号("")不能使用单引号('')

wtu -i ""

如:【wtu -i "D:\Desktop\wxmini_demo\mini"】,回车后即可以在源项目同及目录得到一个后缀为_uni的目录,即转换成功

工具升级命令

因为工具更新比较频繁,安装后,可以使用如下命令进行升级

npm update miniprogram-to-uniapp -g

工具源码

仓库地址:https://github.com/zhangdaren/miniprogram-to-uniapp

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

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1163626.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

2023年江西省职业院校技能竞赛“网络安全”赛项样题

二、竞赛注意事项 1.竞赛期间禁止携带和使用移动存储设备、计算器、通信工具及 参考资料。 2.请根据大赛所提供的竞赛环境&#xff0c;检查所列的硬件设备、软件清 单、材料清单是否齐全&#xff0c;计算机设备是否能正常使用。 3.在进行任何操作之前&#xff0c;请阅读每个部分…

ElementUI 自定义 Tree 树形控件背景

在 template 中 <div class"container"><el-tree :data"treeList" :props"defaultProps" accordion node-click"handleNodeClick" /> </div> 在 script 中 treeList: [{ id: "-1", label: "区域选…

视频剪辑技巧:如何使用背景图片增强视频的画中画效果

在视频剪辑中&#xff0c;背景图片的运用可以极大地增强视频的视觉效果&#xff0c;尤其是画中画效果的呈现。本文介绍如何使用云炫AI智剪将背景图片批量制作画中画视频的实用剪辑技巧。未来随着技术的不断发展和创新&#xff0c;我们可以期待更多富有创意的视频作品出现。同时…

Vue 事件绑定 和 修饰符

目录 一、事件绑定 1.简介 : 2.实例 : 二、修饰符 1.简介 : 2.实例 : 3.扩展 : 一、事件绑定 1.简介 : (1) 在Vue中&#xff0c;通过"v-on:事件名"可以绑定事件&#xff0c;eg : v-on:click表示绑定点击事件。 (2) 触发事件时调用的方法&#xff0c;定义在Vu…

linux安装apache并配置userid站点

目录 一、linux安装apache的方式 1、安装wget 2、下载CentOS 7的repo文件 3、更新镜像源 二、安装apache 1.通过命令直接安装apache(linux的软件包为httpd) 2.启动httpd服务 3.访问一下 三、apache配置文件 1.主配置文件 2.修改根目录 3.修改下端口 4.apache的工作…

【完整代码文章】2023粤港澳金融数学建模B题代码文章

基于中国特色估值体系的股票模型分析和投资策略 完整的文章和代码都已经给到 摘要 中国特色估值体系的主要特色和核心内涵是政策导向。2022年下半年&#xff0c;证监会党委书记、主席易会满在《求是》杂志发表文章提出&#xff0c;努力建设中国特色现代资本市场。在2022年11…

UE5加载websocket模块为空

今天测试UE 发现工程启动不了&#xff0c;后来看到原来是websocket模块无法加载。 解决的它的方法很简单&#xff0c;这种问题一般会出现在源码版本的引擎或者是停电了&#xff0c;导致UElaunch版本损坏&#xff0c;解决方法是来到源码版本的引擎 这个目录下&#xff1a; D:\…

凸包问题——分治法 Python实现

凸包问题。给定平面上n个点&#xff0c;从中找出一个最小点集&#xff0c;使得该点集所组成的凸多边形包围所有的n个点。基于分治策略&#xff0c;设计一个求解凸包问题的算法。实现该算法并测试。 分治算法思路&#xff1a; 如果点集中的点数小于等于3&#xff0c;可以直接返…

管理类联考——数学——汇总篇——知识点突破——代数——函数、方程——记忆

文章目录 考点记忆/考点汇总——按大纲 整体局部 本篇思路&#xff1a;根据各方的资料&#xff0c;比如名师的资料&#xff0c;按大纲或者其他方式&#xff0c;收集/汇总考点&#xff0c;即需记忆点&#xff0c;在通过整体的记忆法&#xff0c;比如整体信息很多&#xff0c;通常…

hdlbits系列verilog解答(always块if语句)-31

文章目录 一、问题描述二、verilog源码三、仿真结果一、问题描述 if 语句通常创建一个 2 对 1 多路复用器,如果条件为 true,则选择一个输入,如果条件为 false,则选择另一个输入。 always @(*) begin if (condition) begin out = x; end else begin out = y; end end 这等…

【算法专题】双指针—有效三角形的个数

一、题目解析 题目链接&#xff1a;有效三角形的个数 我们知道想要组成一个三角形那么其任意两边之和必定大于第三边&#xff0c;即 但是如果我们知道这三条边的大小顺序&#xff0c;那么只需判断一次即可&#xff0c;假设c是最大的那条边&#xff0c;那么不等式②和③不用判断…

Rust编程基础之函数和表达式

1.Rust函数 在之前的文章中,我们已经见到了一个函数:main函数, 它是很多程序的入口点。也见过 fn 关键字&#xff0c;它用来声明新函数。 Rust 代码中的函数和变量名使用 snake case 规范风格。在 snake case 中&#xff0c;所有字母都是小写并使用下划线分隔单词。这是一个包…

LEEDCODE 709转换成小写字母

class Solution { public:string toLowerCase(string s) {int len s.length();string a "";for(int i 0; i < len; i){if(s[i] > 65 && s[i] < 90){a (s[i] 32);}elsea s[i];}// cout<<a<<endl;return a;} };

行业追踪,2023-11-02

自动复盘 2023-11-02 凡所有相&#xff0c;皆是虚妄。若见诸相非相&#xff0c;即见如来。 k 线图是最好的老师&#xff0c;每天持续发布板块的rps排名&#xff0c;追踪板块&#xff0c;板块来开仓&#xff0c;板块去清仓&#xff0c;丢弃自以为是的想法&#xff0c;板块去留让…

Amazon Generative AI 新世界 | 基于 Amazon 扩散模型原理的代码实践之采样篇

以前通过论文介绍 Amazon 生成式 AI 和大语言模型&#xff08;LLMs&#xff09;的主要原理之外&#xff0c;在代码实践环节主要还是局限于是引入预训练模型、在预训练模型基础上做微调、使用 API 等等。很多开发人员觉得还不过瘾&#xff0c;希望内容可以更加深入。因此&#x…

uniapp循环对象列表---点击列表切换选中不同状态

目录 源码图片最后 源码 <template><view><ul><li v-for"(item, index) in list" click"toggleSelection(index)" :class"{selected: selectedIndex index}">{{ item }}<view :class"{selected: selectedInde…

系列五、映射文件xxxMapper.xml

一、概述 mapper映射文件是mybatis中最重要的部分&#xff0c;涉及到的细节也非常多。 1.1、parameterType 表示输入参数的类型。例如&#xff1a; <select id"getUserById" parameterType"integer" resultType"org.star.entity.model.UserDO&…

Mysql数据库基础知识补充

sql知识补充 一.数据库的操作1.显示当前数据库2.创建数据库3.使用数据库4.删除数据库 二.常用数据类型1.数值类型2.字符串类型3.日期类型 三.表的操作1.查看表结构2.创建表3.删除表 一.数据库的操作 1.显示当前数据库 2.创建数据库 3.使用数据库 4.删除数据库 二.常用数据类型…

netty实战-手写通信框架

通信框架功能设计 功能描述 通信框架承载了业务内部各模块之间的消息交互和服务调用&#xff0c;它的主要功能如下&#xff1a; 基于 Netty 的 NIO 通信框架&#xff0c;提供高性能的异步通信能力&#xff1b; 提供消息的编解码框架&#xff0c;可以实现 POJO 的序列化和反序…

轻松部署Swagger Editor:安装Docker并实现远程访问编辑API文档

文章目录 Swagger Editor本地接口文档公网远程访问1. 部署Swagger Editor2. Linux安装Cpolar3. 配置Swagger Editor公网地址4. 远程访问Swagger Editor5. 固定Swagger Editor公网地址 Swagger Editor本地接口文档公网远程访问 Swagger Editor是一个用于编写OpenAPI规范的开源编…