跳转到主要内容

hbuilder项目转vue项目&&jenkins uniapp

使用vue cli工具、uni预设创建新的项目

官方参考:https://uniapp.dcloud.net.cn/quickstart-cli.html

VUE3项目

如果不知道当前项目用的是什么VUE版本,可以去manifest.json查看vueVersion字段


# VUE3 javascript 项目
npx degit dcloudio/uni-preset-vue#vite my-vue3-project

# VUE3  typescript项目
npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project

VUE2项目

# 需要全局安装 vue-cli

npm install --location=global @vue/cli@4  --registry=http://registry.npmmirror.com

# 使用预设创建项目
vue create -p dcloudio/uni-preset-vue my-project

根据项目类型选择预设模板(选择默认即可)

使用Vue3/Vite版不会提示,目前只支持创建默认模板

移植项目


# 先将项目运行起来
npm install  --registry=http://registry.npmmirror.com
npm run dev

# 删除新项目中的src目录内文件

# 复制老项目文件
# .git  package.json package-lock.json node_modules vue.config 不需要复制
# .env 不需要要复制
# 
#
#
#
# 如果你的package.json有内容,需要手动合并到项目外层的package.json

# 再次运行
npm run dev

替换node-sass

如果运行时出现出现node-saas错误


  "devDependencies": {
    "less": "^4.3.0",
    "sass": "^1.55.0",
  }

打包APP提示:本应用使用 HBuilderX 4.66 或对应的cli版本编译,而手机端SDK版本是 3.96。不匹配的版本可能造成应用异常。

原因是HBuilder与cli的版本不一致

方法一:使用与cli版本一致的hbuilder

历史版本hbuilder下载地址:https://hx.dcloud.net.cn/Tutorial/HistoryVersion

方法二:在hbuilder里面仅加载项目的src目录进行打包(可以救急,但是不推荐)

方法三:将cli的版本升级与HBuilder保持一致

最简单的方法是使用npx @dcloudio/uvm@latest升级到最新版,然后下载最新的hbuilder

确定HBuilder的cli版本,打开hbuilder的关于界面,确定hbuild的版本

确定hbuilder的详细版本号

确定hbuilder的详细版本号

hbuilderx官网:https://www.dcloud.io/hbuilderx.html

# 将cli的版本与hbuilder保持一致,此时可能报错,提示版本编号应该是x.y.z
# 需要到hbuilder官网找到真正的版本号
# 此时可能还会继续提示例如nodejs版本不匹配,请升级nodejs版本
# 依赖冲突等,例如vite和vue版本不冲突,安装提示修改为匹配的版本既可

npx @dcloudio/uvm@latest 3.96.2023110403

部分hbuilder和cli版本对照关系
hbuilder版本 cli版本 备注
4.45 4.45.2025010502 ---
3.96 3.96.2023110403 ---