1、执行npm run build之后生成dist文件夹

2、打开HBuilderX新建一个APP项目

3、把dist文件夹里的所有文件拷贝替换到APP文件夹下

4、打开manifest.json文件配置相关内容（自行百度，配置APP图标等选项）

5、点击软件顶上的发行--原生APP-云打包进行打包

6、打包后下载安装即可

-----------------------------------------------------------------------------------------------------------------------------------------

重点说一下坑点：两个问题都是路径问题，相对绝对路径就不解释了，只说一种解决办法（新手视角，不足之处请大神指教）

1、安装后看到的是一片空白

这个是路径问题，修改index.html文件里的路径即可,把引入路径都改成 ./xxx/xx/xxxx

2、本地的静态资源不显示

也是路径问题，打开项目列表可以看到

打开app.b73e1550.js文件搜索图片，可以看到

修改路径即可

「Vue」vue cli3项目打包为APP方法及坑点的更多相关文章

  1. 「Vue」vue cli3中axios的基本用法

    1.安装axiosnpm i axios -S2.main.js中设置import axios from 'axios'Vue.prototype.$axios = axiosPS:这里有个小坑,ax ...

  2. Electron+Vue – 基础学习(2): 项目打包成exe桌面应用

    项目创建完成,启动正常,接下来就是项目打包了.将测试Demo打包成exe桌面应用,点击exe文件,运行项目. 书接上文,创建项目有三种方式 Git拷贝.直接创建:通过electron社群提供的命令行工 ...

  3. 「Vue」Vue cli3中引用mui-ui问题及解决办法

    1.引用mui.js无效,top-bar划动,numbox点击无效等问题 解决办法: -main.js中import mui from './lib/mui/js/mui.js' Vue.protot ...

  4. 「Vue」vue生命周期

    Vue的生命周期 beforeCreate---created---beforeMount---mounted---(beforeupdate---updated :数据有更新时才会执行)---bef ...

  5. Jenkins实现单一安卓项目打包多个module填坑实录

    今天接手一个任务,已有项目结构上新添加了一个module,这个module打包工作需要在Jenkins上添加一个方便测试点击的打包工程 因为之前已有现成的打包工程,我直接新建了一个工程并且复制原有工程 ...

  6. vux构建的项目打包成app出的一些问题

    1.static里面能放一些外部的插件,css可以放static,引用的时候按照相对路径写, less不可以,因为放在static里面的文件不会经过webpack的处理,所以也就不会编译成css,所以 ...

  7. vue-cli创建的项目打包成app引入字体图标的问题

    将项目在手机端调试时,发现引入的阿里图标显示不出来,需要在引入的iconfont.css文件夹里给url加上https

  8. vuejs项目打包成APP后，首页不显示

  9. vue+webpack项目打包后背景图片加载不出来问题解决

    在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...

随机推荐

  1. Qt 的线程与事件循环

    Qt 的线程与事件循环

  2. Codeforces 954C Matrix Walk (思维)

    题目链接:Matrix Walk 题意:设有一个N×M的矩阵,矩阵每个格子都有从1-n×m的一个特定的数,具体数的排列如图所示.假设一个人每次只能在这个矩阵上的四个方向移动一格(上下左右),给出一条移 ...

  3. HTML快速入门（一）

    一.HTML 是什么? HTML 指的是超文本标记语言 (Hyper Text Markup Language) HTML 不是一种编程语言,而是一种标记语言 (markup language) 标记 ...

  4. markdown 笔记二

    Markdown 语法笔记==============================1,头部欢迎# 欢迎使用flaskBlog ------ flask对于我来说,适合快速开发一些小网页,自己也想整 ...

  5. 学习 google file system 心得体会

    Google File system文件系统,是在特别便宜的普通硬件设备上运行,它是一个面向大规模数据密集型运用的.可伸缩的分布式文件系统. 与传统文件相比,它认为组件失效是很平常的事件,因为GFS包 ...

  6. NO.3：自学tensorflow之路------MNIST识别，神经网络拓展

    引言 最近自学GRU神经网络,感觉真的不简单.为了能够快速跑完程序,给我的渣渣笔记本(GT650M)也安装了一个GPU版的tensorflow.顺便也更新了版本到了tensorflow-gpu 1.7 ...

  7. 桌面输入法评测报告 之 搜狗拼音输入法vs必应拼音输入法

    输入法是电脑用户不可或缺的软件,它几乎无时无刻不陪伴在使用者的身旁.一个优秀的输入法,应该满足客户对使用体验以及效率的需求.我们小队的任务便是对当今最为常用的两种输入法: 搜狗拼音输入法和必应拼音输入 ...

  8. 《Linux内核分析》 之 计算机是如何工作的

    [李行之原创作品 转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000] <Linux内 ...

  9. 《Linux 内核分析》第五周

    [李行之原创作品 转载请注明出处 <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000] <Linux内 ...

  10. C# 7中函数多值返回_转自InfoQ

    本文要点 应遵循<.NET设计规范:.NET约定惯用法与模式>一书.和十年前第一版出版时一样,书中给出的原则在当前依然有指导意义. API设计是最重要的.设计不好的API会在极大地增加软件 ...