uni-app HBuilderX项目转为cli项目及踩坑记录

news2024/10/6 22:26:42

uni-app有两种创建创建项目的方式,通过HBuilderX可视化界面进行创建和通过vue-cli命令行,两者的区别可以参考uni-app官网-可视化方式的区别

其中cli项目是可以直接运行在hx中的,相比hx项目,cli的好处还有可以自定义环境变量和自定义h5、app资源的打包输出

步骤1

新建vue-cli项目

vue create -p dcloudio/uni-preset-vue my-project

默认会安装最新的编译器版本,如果与离线打包的sdk版本不同,需要修改依赖为指定版本,如

npx @dcloudio/uvm 3.6.4.20220922

注意这里一定是完整的版本号

步骤2

迁移代码到cli项目

cli项目是传统的node项目结构,工程代码都在src目录下,将hx工程文件拷贝至src目录,除unpackage、nativeplugins和工程化的文件eslint、pretty、node_modules等

步骤3

将项目中的依赖的包汇总到cli项目的package.json中,重新安装包依赖

步骤4

cli项目支持env,同vue项目一致Vue2,Vue3,可按需求添加

注意事项

如果项目之前在hx中打开过,转换成cli项目后需要重新导入,或者重启hx,好让hx正确识别manifest.json,否则无法使用hx运行。

转为cli项目后scss的编译会有区别,深度选择器不支持/deep/,需要使用::v-deep,vue中,>>>、/deep/、::v-deep都是>>>的别名

打包后的产物默认在根目录下的dist文件夹,自定义基座路径为dist/debug

踩坑记录

1.Syntax Error: Error: Node Sass version 5.0.0 is incompatible with ^4.0.0

node-sass的版本要与node版本对应起来,见node-sass - npm

本地node是v14,改为node-sass@~4.14.0

2. Node Sass could not find a binding for your current enviroment

该问题出现在hx中运行h5,hx是自带了node的环境的,mac系统上路径为/Applications/HBuilderX.app/Contents/HBuilderX/plugins/node,而且这个是v12版本(查看自己hx对应的node版本,到这个目录下执行./node -v),再降低node-sass版本到~4.12.0

3.Internal Babel error: path is not in loop. Please report this as a bug

 

汇总依赖包时候babel的问题,有些已经集成到cli的项目中,建议以cli项目的为准,如果有缺少的再做补充

4.ios真机运行问题

 转为cli项目后debug包的路径发生变化,虽然选了自定义基座,实际并读取不到,重新生成自定义基座或是复制unpackage/debug到dist/debug

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

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

相关文章

借助“云上”SPSS降低未来数据分析的不确定性

生活工作中我们常常会遇到这样或那样的困难,比如不得不临时居家办工,却发现家中电脑没有安装工作中的必备软件,比如毕业论文写到一半,同学告诉你,新版的软件升级加强了某个模型,能让你更好的完成论文。软件…

浅析从DWARF到BTF @龙蜥社区eBPF SIG

一、背景 一个程序会经历编码、编译、运行的过程,但所有的开发几乎都不可能是一帆风顺的,总会有些意想不到的错误,这时便需要调试。那么调试器使用的调试信息是从哪里来的呢?答案就是从编译后的文件中来的(依赖编译的时候使用特定…

Kubernetes使用Ingress Nginx流量代理

理论了解 1、ingress简介 kubernetes官方文档 Ingress 是 kubernetes API 中的标准资源类型之一,ingress 实现的功能是在应用层对客户端请求的 host 名称或请求的 URL 路径把请求转发到指定的 service 资源的规则,即用于将 kubernetes 集群外部的请求…

数字孪生水电站:发电流程三维可视化优化

从大禹治水到三峡大坝的建造,人类为控制和调配自然界的地表水和地下水,修建了许多的水利工程。对水资源进行了广泛的开发利用,诸如农业灌溉、工业和生活用水、水力发电、航运、港口运输、淡水养殖、旅游等。 将图扑软件与 GIS、粒子仿真、虚拟…

动作捕捉系统用于微创手术

微创手术是医生通过病人体表的微小切口,将细长的手术工具探入病人体内进行手术操作。与传统的开口手术相比,这种方式可减少手术对病人造成的创伤,缩短恢复时间。但是,微创手术也给医生的操作带来了一系列困难:比如受小…

Autoform R10中文版安装说明教程

1、安装R8的服务RLM_v12.0BL2 2、拷贝文件到相关目录(1、许可证,C:\Program Files安装许可的位置。。。直接停止服务后替换R10 BIN文件 然后改环境变量(这里可以直接改,也可以删掉然后重新输入,建议删掉后输入&#x…

上海亚商投顾:创业板缩量跌近1% 血氧仪概念逆市大涨

上海亚商投顾前言:无惧大盘大跌,解密龙虎榜资金,跟踪一线游资和机构资金动向,识别短期热点和强势个股。 市场情绪沪指早间低开高走,盘中一度拉升翻红,午后又再度下挫,深成指、创业板指均跌近1%。…

5G网络的关键技术及特点,面临的挑战!

01 5G关键技术 超密集组网:5G需要满足热点高容量场景(高流量密度、高速率) 超密集组网:大量增加小基站,以空间换性能 基站一般包括:宏基站和小基站 宏基站:即“铁塔站”,一般覆盖范围数千米…

Linux课程笔记

Linux基础命令 Linux的目录结构 /,根目录是最顶级的目录了Linux只有一个顶级目录:/路径描述的层次关系同样适用/来表示/home/itheima/a.txt,表示根目录下的home文件夹内有itheima文件夹,内有a.txt ls命令 功能:列出…

【北邮】计算机组成原理实验:实验一 运算器组成实验

实验一 运算器组成实验 实验目的 ⑴熟悉逻辑测试笔的使用方法。 ⑵熟悉 TEC-8 模型计算机的节拍脉冲 T1、T2、T3; ⑶熟悉双端口通用寄存器组的读写操作; ⑷熟悉运算器的数据传送通路; ⑸验证 74LS181 的加、减、与、或功能&#xff1…

Python数据容器(五)

python学习之旅(五) 👍基础语法部分笔记(一) 👍条件判断部分笔记(二) 👍循环语句部分笔记(三) 👍函数使用部分笔记(四) 👍数据容器部分笔记(五) 一.数据容器 一种可以容纳多份数据的数据类型&am…

kail - 扫描与爆破

数据来源 扫描技术 背景 在渗透测试过程中,为了节省人力和时间,通常采用手工和工具相结合的方式。使用工具,就是将一些机械性的操作自动化实现,用来提高渗透测试的效率。例如,寻找内网网段[10.10.10,20/24]所有在线主…

MySQL窗口函数 和 阿里云日志15日留存率仪表盘统计脚本实现

窗口函数的官方描述:窗口函数对一组查询行执行类似聚合的操作。但是,虽然聚合操作将查询行分组为单个结果行,但窗口函数会为每个查询行生成一个结果,发生函数评估的行称为当前行,与发生函数评估的当前行相关的查询行构…

Kubernetes证书热更新期限至100年【HA高可用集群】

一、问题与环境 1.为什么更新证书?局域网如何保障服务稳定性?   众所周知k8s(Kubernetes)有一个默认证书期限为一年不成文的规定,官方的解释是“最佳的做法是经常升级集群以确保安全。(升级后集群证书自…

MySQL表的增删查改

目录 1、表的插入 <1> 全列插入 <2> 指定列插入 <3> 插入否则更新 <4> 替换 2、表的查找 <1>全列查询 <2>指定列查询 <3> where条件 <4> 筛选分页结果 3、表的修改 4、表的数据删除 5、查看表结构 6、插入查询结…

SpringCloud微服务项目实战 - 2.App登录及网关

如果你追求一个局部的更好甚至完美,你有可能花费巨大的资源和时间&#xff1b; 从总体上看&#xff0c;这往往意味着总体的浪费和失败&#xff0c;这是传说中的“打赢了战役打输了战争”。 系列文章目录 项目搭建App登录及网关 文章目录系列文章目录一、App登录1. 需求分析2. …

2020-2021 ICPC, NERC, Southern and Volga Russian Regional Contest K. The Robot

翻译&#xff1a; 有一个机器人在一个没有尽头的方格场上。最初&#xff0c;机器人位于坐标为(0,0)的单元中。他将执行由一串大写拉丁字母“L”、“R”、“D”、“U”所描述的命令。当一个命令被执行时&#xff0c;机器人只是朝着相应的方向移动: “L”:向左一个单元格(当前单…

【聆思CSK6 视觉AI开发套件试用】AI控制直流电机转速接口打通

本篇文章来自极术社区与聆思科技组织的CSK6 视觉AI开发套件活动&#xff0c;更多开发板试用活动请关注极术社区网站。作者&#xff1a;oxlm 背景 在访问极术社区时&#xff0c;偶然发现聆思科技的CSK6开发板的评估活动&#xff0c;看CSK6的硬件配置和技术规格&#xff0c;300M…

JavaScript奇淫技巧:变速齿轮

JavaScript奇淫技巧&#xff1a;变速齿轮 在PC时代&#xff0c;曾有个名为“变速齿轮”的神奇软件&#xff0c;可以加快或减慢系统时间。 当时常用来修改游戏速度&#xff0c;可实现外挂一般的效果&#xff0c;很不可思议。 本文&#xff0c;将用JavaScript复刻这一功能&…

maven在无互联网(内网)环境下打包

Maven在内网环境打包 首先需要准备好项目所需的所有依赖包 我们可以在外网环境下&#xff0c;更改idea中Maven的local repository目录&#xff0c;然后刷新一下项目&#xff0c;将项目所需的依赖下载到更换的目录下 将新建的依赖目录和项目一起拷贝到内网环境下将依赖文件拷贝…