把vue-cli脚手架打包成移动端5+app

一、使用HbuildX，创建5+app项目

点击创建，项目创建成功，把下面除了manifest.json文件都可以删除

二、运行npm run build打包vue项目

vue项目打包成功后，会生成dist文件，找到该文件下的 static 和index.html

复制 static 和index.html 到创建好的5+app项目

三、连接真机，打开手机开发者模式，便可以真机调试了。

温馨提示：

1、若vue项目里面有需要访问api，则需要把api换成具体地址，手机才能访问到api

更改为

便可以访问啦。

2、vue项目中的config文件里的index.js中assetsPublicPath:'/' 要改成 assetsPublicPath:'./'

打包前

打包后

把vue-cli脚手架打包成移动端5+app相关推荐

Vue2.x 核心基础（Vue概述，Vue基本使用，@vue/cli脚手架，Element-UI 的基本使用，Vue模板语法）
1. Vue概述尤雨溪:Vue.js的创建者 2014年2月,Vue.js正式发布 2015年10月27日,正式发布1.0.0 2016年4月27日,发布2.0的预览版本 Vue:渐进式JavaSc ...
猿创征文｜【Vue五分钟】 Vue Cli脚手架创建一个项目
目录前言一.创建项目的操作步骤选择路由模式选择CSS预编译器选择如何存放配置自动下载项目所需的包文件二.启动vue项目 1.项目目录 2.启动项目 3.浏览器打开项目首页界面三.项目的 ...
如何查看vue版本号以及vue/cli脚手架版本号
查看vue版本号方法一:直接在项目的package.json文件,找到dependencies就能看到了方法二:输入命令npm ls vue (或者npm list vue) 查看vue/cli脚 ...
将Vue项目代码打包成桌面应用
参考 electron 官网第一步: 安装Vue脚手架Vue CLI只能用最新版,建议在用官网最新命令行 npm install -g @vue/cli 第二步: 创建vue项目 vue creat ...
Vue 全家桶之 vue cli (脚手架)
一.Vue cli 简介 cli --------------------- c : command (命令) l : line ( 行 ) i : interface ( 接口 ) 命令行接口命令 ...
1. Vue CLI脚手架
1.1 介绍 Vue脚手架指的是vue-cli,它是一个专门为单页面应用快速搭建的脚手架,它可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板,是Vue官方提供的标准化开发工 ...
如何修改vue打包的名字_关于Vue项目如何打包成带有访问前缀URL（二级域名）的vue发布包及自定义打包包名（默认都是dist）的二三事...
由于vue项目使用的是vue-cli脚手架,在脚手架更新到3.7.0版本后,使用vue create指令生成项目时并没有显示集成webpack的选项和生成对应配置文件,这使得webpack直接内嵌进v ...
Vue CLI 脚手架详解：快速构建 Vue.js 项目的利器
目录一.安装和创建项目二.项目结构三.开发和构建四.插件和配置 Vue CLI 是 Vue.js 官方提供的脚手架工具,它可以帮助开发者快速搭建 Vue.js 项目的基础结构,并提供了丰富的功 ...
vue Cli 脚手架的搭建
1.安装 node.js 应用安装完之后测试是否安装成功,如图: 2.全局安装 vue - cli 输入命令符: npm install --global vue-cli 测试是否安装成功,成功如 ...

把vue-cli脚手架打包成移动端5+app

把vue-cli脚手架打包成移动端5+app相关推荐

最新文章

热门文章