1.在打包之前需要修改一个地方，那就是config->index.js文件，修改assetsPublicPath: '/'为assetsPublicPath: './',截图如下

上面文件改好后，开始打包，执行如下命令：

npm run build

生成 dist 文件夹

2.打包步骤

步骤一：

将 dist 文件 放入 HBuilder 编辑器中，将项目 转换成 App ，生成 manifest.json

步骤二：

配置 manifest.json , 点击 "发行" 按钮 -- 发行为原生安装包(P)

步骤三：

安装 -- 测试 -- 上线

HBuilder 打包 vue-cli 构建的 APP的更多相关文章

  1. 利用HBuilder打包Vue开发的webapp为app

    众所周知,前端开发完成的webapp只能运行在浏览器上,对运行环境有一定的限制,也就是除了浏览器其他的环境下不支持:那么现在如果有个需求是这样的呢?需要一套代码三端运行呢?三端运行(黑人脸??)是的, ...

  2. 使用hbuilder打包vue项目容易出现的坑点

    1.打包后手机打开"该app专为旧版本安卓"问题解决(在hbuilder中设置) 打开manifest.json 然后 2.打包后app打开显示白屏. 路径问题:在webpack中 ...

  3. HBuilder打包vue项目app后空白，并请求不到数据

    (解决空白问题)在打包之前一定要修改 config 目录下的 index.js 文件中的 bulid 模块打包配置项,否则会出现空白,如图   修改前 assetsPublicPath= '/',. ...

  4. vue cli 构建的 webpack 项目设置多页面

    1. webpack-dev-server下的设置(npm run dev) ./build/webpack.dev.conf.js 中,修改 new HtmlWebpackPlugin ,一个页面一 ...

  5. VUE学习笔记之vue cli 构建项目

    一.环境搭建: 1.安装node.js 从node.js官网下载并安装node,安装过程很简单,一路"下一步"就可以了.安装完成之后,打开命令行工具(win+r,然后输入cmd), ...

  6. vue+cordova 构建hybrid app

    配了一个 vue + cordova + ionicCli 的 项目 支持 ionic 的脚手架命令 支持 cordova 的 插件 安装使用 支持 webpack 的自动构建 vue 安装了 vue ...

  7. vue脚手架 构建豆瓣App 第一天

    课堂笔记: 项目结构分析: 项目入口:index.html(div#app) 全局vue组件:App.vue(template:div#app) 通过相同id的div,index.html与Appvu ...

  8. @vue/cli 构建得项目eslint配置

    如下:package.json // package.json { "name": "ecommerce-mall-front", "version& ...

  9. 使用Vue CLI构建Vue项目

    第一步:首先在控制台输入vue --version,如果出现版本号则进入第三步:否则进入第二步: 第二步:输入npm install cnpm -g --registry=https://regist ...

  10. @vue/cli 构建得项目eslint配置2

    使用ESLint+Prettier来统一前端代码风格 加分号还是不加分号?tab还是空格?你还在为代码风格与同事争论得面红耳赤吗? 正文之前,先看个段子放松一下: 去死吧!你这个异教徒! 想起自己刚入 ...

随机推荐

  1. Linux命令之ftp

    ftp [-pinegvd] [host] pftp [-inegvd] [host] 用户通过ftp这个程序来使用Internet上的标准文件传输协议(FTP).本程序允许用户向远端网站发送文件,或 ...

  2. 关于oracle存储过程需要注意的问题

    在使用oracle存储过程时,有一些需要注意的地方,下面就来总结一下. 1.在oracle的存储过程中,数据表别名不能加as 也许是为了区分存储过程中的as,怕与过程中的as冲突. 如: select ...

  3. 2017 ACM-ICPC ECFINAL过山车体验

    这次采用domjudge判题,算是比较好玩的啦.外榜地址:http://board.acmicpc.cn/ 然后我们很可惜地止步于192名QAQ,没看出C是个傻逼题,没读懂B..我得背锅,亏我还打了那 ...

  4. BZOJ 3022 [Balkan2012]The Best Teams（扫描线+线段树）

    [题目链接] http://www.lydsy.com/JudgeOnline/problem.php?id=3022 [题目大意] 给定n个球员,第i个球员年龄为AGEi,水平为SKILLi. 没有 ...

  5. 【推导】Codeforces Round #411 (Div. 1) A. Find Amir

    1 2 3 4 5 6 7 4-5-3-6-2-7-1 答案是(n-1)/2 #include<cstdio> using namespace std; int n; int main() ...

  6. java 的环境搭建

    java.JDK 的搭建__本人是在360里下载的.也可以去其它的网站. java.jdk官网地址下载: https://download.oracle.com 二.也可以下载地址:http://do ...

  7. SpringBoot 整合 Jpa

    项目目录结构 pom文件 <?xml version="1.0" encoding="UTF-8"?> <project xmlns=&quo ...

  8. 【Data URL】【RE】【bugku】逆向入门writeup

    在写wp之前先来了解一下Data URL是什么 Data URL 在浏览器向服务端发送请求来引用资源时,一般浏览器都有同一时间并发请求数不超过4个的限制.所以如果一个网页需要引用大量的服务端资源,就会 ...

  9. CDOJ 1279 班委选举 每周一题 div2 暴力

    班委选举 题目连接: http://acm.uestc.edu.cn/#/status/list?problemId=1279 Description 高考的脚步越来越近了--时间如山涧小溪一般悄无声 ...

  10. 【Rocket MQ】RocketMQ4.2.0 和 spring boot的结合使用，实现分布式事务

    RocketMQ4.2.0 和 spring boot的结合使用,实现分布式事务 参考地址:https://www.jianshu.com/p/f57de40621a0