创建可以离线打包开发的uniapp H5项目

安装node环境

安装vue脚手架,在线

npm install -g @vue/cli

PS:vue-cli已进入维护模式,vue3最新脚手架使用npm init vue@latest安装,安装后使用create-vue替换vue指令,create-vue底层使用vite提升前端开发效率(Note16.0+)

使用命令创建一个uniapp项目,在线

默认使用的https://registry.npmmirror.com作为镜像源

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

选择一个模板

如果下载不下来,可以用离线模式,指定使用的模板位置为本地

下载uniapp离线模板,在线

gitee仓库:

https://gitee.com/dcloud/uni-preset-vue/tree/vite

https://gitee.com/dcloud

uni-preset-vue-master.zip

uni-preset-vue-vite.zip

创建uniapp离线版的h5项目 离线

vue create -p D:/uni-preset-vue-master my-project

这里可以指定模板目录为D:/uni-preset-vue-master

默认下载之后就有依赖了,如果没有初始化依赖,使用以下命令初始化模块依赖:

npm install

文件结构:

运行

打开控制台,进入根目录

使用命令运行:

npm run serve

默认访问地址:http://localhost:8080/#/

使用HBuilderX运行

打包npm run build

相关推荐
bug总结2 小时前
深入理解 uni-app 的 uni.createSelectorQuery()
uni-app
真上帝的左手2 小时前
25. 移动端-uni-app
uni-app
编程猪猪侠2 小时前
基于Uni-app+vue3实现微信小程序地图固定中心点范围内拖拽选择位置功能(分步骤详解)
uni-app
小徐_23335 小时前
Trae 辅助下的 uni-app 跨端小程序工程化开发实践分享
前端·uni-app·trae
斯~内克5 小时前
UniApp 页面传参方式详解
网络协议·udp·uni-app
大聪明了8 小时前
uniapp vue3 使用 pinia
javascript·vue.js·uni-app
LilyCoder9 小时前
HTML5二十四节气网站源码
前端·javascript·html·html5
有梦想的刺儿19 小时前
uniapp手机端video标签层级过高问题
uni-app
&白帝&21 小时前
Uniapp 获取系统信息:uni.getSystemInfo 与 uni.getSystemInfoSync
uni-app
浊浪载清辉1 天前
基于HTML5与Tailwind CSS的现代运势抽签系统技术解析
前端·css·html5·随机运签·样式技巧