小程序转h5步骤(利用uniapp)

超、凢脫俗 2023-03-13 06:09 3阅读 0赞

### 1.介绍个好用的工具，那便是miniprogram-to-uniapp自动转换工具。 ###

### 2.全局安装此工具，命令行如下 ###

npm install miniprogram-to-uniapp -g

### 3.查看工具版本号，命令行如下 ###

wtu -V

回车若显示该工具版本号，则证明安装成功

### 4.开始进行转换，命令行如下 ###

//冒号里面是小程序的项目路径
    
    wtu -i "E:\其他\patient-wechat\miniprogram"

回车后即可以在源项目同及目录得到一个后缀为\_uni的目录，即转换成功。

![20200512104623125.png][]

注意，此工具转换后是适用HBuilderX 工程。如果想要用vscode开发，转成vue-cli工程，继续一下操作。

## HBuilderX 工程转换为 vue-cli 工程 ##

### 步骤 ###

1.  使用 vue-cli 新建空工程

不知怎么创建可参考文章 [https://blog.csdn.net/qq\_39167934/article/details/106021002][https_blog.csdn.net_qq_39167934_article_details_106021002]

1.  将 HBuilderX 工程内的文件（除 unpackage、node\_modules 目录）拷贝至 vue-cli 工程内 src 目录
2.  在 vue-cli 工程内重新安装 npm 依赖（如果之前使用了 npm 依赖的话）

## vue-cli 工程转换为 HBuilderX 工程 ##

当需要开发 App 端时，可以转换为 HBuilderX 工程（不转换直接在HBuilderX 2.0+中也可以运行）

### 步骤 ###

1.  将 vue-cli 工程（需为uni-app项目）内的 src 目录复制一份，导入 HBuilderX 作为新工程。
2.  在新工程目录内重新安装 npm 依赖（如果之前使用了 npm 依赖的话，记得先 npm init 初始化）

[20200512104623125.png]: /images/20230312/bcfad1d6da85441baa0967d97fed9c91.png
[https_blog.csdn.net_qq_39167934_article_details_106021002]: https://blog.csdn.net/qq_39167934/article/details/106021002

发表评论取消回复

表情：

评论列表（有 0 条评论，3人围观）

还没有评论，来说两句吧...

相关阅读

相关 SpringBoot+uniapp+uview打造H5+小程序+APP入门学习的聊天小项目

JavaDog Chat 简单通讯聊天软件是基于SpringBoot+MybatisPlus+uniapp+uview+stomp等更多优秀组件及前沿技术开发，注释丰富，...

迷南。/ 2024年05月11日 09:05/ 0 赞/ 42 阅读

相关 H5网页跳转小程序

现在小程序越来越普遍了，从H5网页（要在微信浏览器下打开的）跳转到相应小程序的场景也越来越多。至此微信提供了相应的[微信开放标签][Link 1]让网页开发者可安全便捷地使用微

超、凢脫俗/ 2023年10月14日 04:50/ 0 赞/ 64 阅读

相关使用uni-app开发（h5、小程序、app）步骤

uni-app介绍 `uni-app` 是一个使用 [Vue.js][] 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序

川长思鸟来/ 2023年07月18日 02:41/ 0 赞/ 3 阅读

相关小程序转h5步骤(利用uniapp)

1.介绍个好用的工具，那便是miniprogram-to-uniapp自动转换工具。 2.全局安装此工具，命令行如下 npm install minipro

超、凢脫俗/ 2023年03月13日 06:09/ 0 赞/ 4 阅读

相关 vue+uniapp：小程序H5使用图表组件（uCharts）

一、打开组件网站：[https://ext.dcloud.net.cn/plugin?id=271][https_ext.dcloud.net.cn_plugin_id_271

布满荆棘的人生/ 2023年01月17日 09:27/ 0 赞/ 373 阅读

相关 H5跳转小程序，uniapp跳转小程序

网页跳转小程序需要使用微信的开放标签 [wx-open-launch-weapp][] ，使用开放标签需要使用微信的jssdk，然后sdk的版本不能低，低版本点击无效。先给

以你之姓@/ 2023年01月17日 07:48/ 0 赞/ 280 阅读

相关微信小程序转成uniapp的h5，请求遇到跨域问题

有两种解决方案第一种：直接运行在uniapp的内置浏览器中，不会遇到跨域问题第二种：在manifest.json的源码中配置h5的跨域代理 "h5

布满荆棘的人生/ 2022年12月17日 03:28/ 0 赞/ 562 阅读

相关 uniApp-h5端跳转外链

跳转外链只能h5，公众号可以实现，小程序不支持跳转外链链接必须是http / https 开头否则跳转是路由后面拼接上跳转地址 // ifdef

痛定思痛。/ 2022年11月01日 05:59/ 0 赞/ 279 阅读

相关 H5跳转小程序仅需一行代码

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM

╰半橙微兮°/ 2022年08月29日 00:12/ 0 赞/ 243 阅读

相关 h5网页跳转到小程序

第一：网页引用 <script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>

清疚/ 2022年01月23日 04:25/ 0 赞/ 360 阅读