1、打包成功不报错,但是打开页面啥都没有?
 解决:文件位置:config目录下index.js文件更改assetsPublicPath属性:文件里面有两个assetsPublicPath属性,也就是更改build里面的assetsPublicPath属性:(加上点)
assetsPublicPath:'/'替换成
assetsPublicPath:'./'

 
2、打包完成后某些图片没加载出来,f12提示404,且dist文件下的static文件夹下有一个img文件夹?

原因:图片过大或者资源文件过大、超过了打包规定的限制;

解决:修改build目录下面的webpack.base.conf.js文件下的limit限制,超过你使用到的最大图片资源即可。

 
 
3、每个js和css文件会压缩一个gz后缀的文件夹,浏览器如果支持g-zip 会自动查找有没有gz文件 找到了就加载gz然后本地解压 执行。依赖:
 
npm install --save-dev compression-webpack-plugin
 
4、包的文件中会出现一些map文件,map文件的作用在于:项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。有了map就可以像未加密的代码一样,准确的输出是哪一行哪一列有错。最后你在build之后,然后就会发现就没有自动生成一些map文件了。。。
 
解决:修改config下面的index.js文件夹,
productionSourceMap: true;改为productionSourceMap: false,

 
5、打包后运行项目:刷新界面会出现404?
解决:router目录下的index.js文件,
 mode: 'history',//将这个模式关闭就好

vue-cil 打包爬坑(解决)的更多相关文章

  1. vue项目打包采坑

    1. vue项目打包采坑 1.1. vue运行报错error:Cannot assign to read only property 'exports' of object '#' 这个错误我是在打包 ...

  2. vue项目打包踩坑记

    基于webpack+vue-cli下的vue项目打包命令是 npm run build ,等待打包完成后在根目录生成dist文件夹,里面包含了所有项目相关的内容. 注意:需要完整版的vue-cli项目 ...

  3. 配置使用sourcemap调试vue源码爬坑

    环境: Google Chrome  V72.0.3626.109 vue-dev V 2.6.10 爬坑的乐趣就不说了(我恨啊),以下说一下出坑要点 1. 在vue-dev的package.json ...

  4. Vue 爬坑之路(六)—— 使用 Vuex + axios 发送请求

    Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource 目前主流的 Vue 项目,都选择 axios ...

  5. Vue 爬坑之路(九)—— 用正确的姿势封装组件

    迄今为止做的最大的 Vue 项目终于提交测试,天天加班的日子终于告一段落... 在开发过程中,结合 Vue 组件化的特性,开发通用组件是很基础且重要的工作 通用组件必须具备高性能.低耦合的特性 为了满 ...

  6. Vue 爬坑之路(一)—— 使用 vue-cli 搭建项目

    vue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目,GitHub地址是:https://github.com/vuejs/vue-cli vue ...

  7. Vue 爬坑之路(十二)—— vue-cli 3.x 搭建项目

    Vue Cli 3 官方文档:https://cli.vuejs.org/zh/guide/ 一.安装 @vue/cli 更新到 3.x 之后,vue-cli 的包名从 vue-cli 改成了 @vu ...

  8. Cordova打包vue项目生成Apk (解决cordova build android抛出的zip问题)

    最近对vue前端框架情有独钟.但研究了一下怎么把vue项目打包成android apk来玩玩. 首先讲一下创建vue2.x项目.其实在之前的文章中都有写过,有兴趣的同学可以去看看.http://www ...

  9. vue项目打包后运行报错400如何解决

    昨天一个Vue项目打包后,今天测试,发现无论localhost还是服务器上都运行不了,报错如下: Failed to load resource: the server responded with ...

随机推荐

  1. PHP学习(mysqli函数)

    php是一种运行在服务器端的程序语言,用于生产动态网页内容.特点:开源,简单,易上手,跨平台(windows,linux),占用资源少,尤其适合中小型应用开发.(微博,微信,论坛等等)一,搭建软件环境 ...

  2. 常用命令(java、linux)

    1.java打war包: jar   cvf   temp.war   */  . 命令格式: java cvf 打包文件名称 要打包的目录 打包文件保存路径 解压: jar xvf temp.war ...

  3. 两种RBAC权限控制模型详解

    序言 由于最近一直卡在权限控制这个坎上,原来设计的比较简单的权限控制思路已经无法满足比较复杂一些的场景,因此一直在探索一种在大部分场景下比较通用的权限模型. 首先,这里说明一下两种RBAC权限模型分别 ...

  4. python 子类中定义init方法

  5. Kafka Connect HDFS

    概述 Kafka 的数据如何传输到HDFS?如果仔细思考,会发现这个问题并不简单. 不妨先想一下这两个问题? 1)为什么要将Kafka的数据传输到HDFS上? 2)为什么不直接写HDFS而要通过Kaf ...

  6. php表单的种类

    1.text 2.color 3.date 4.datetime 5.email 6.month 7.number 8.range 9.search 10.tel 11.url 12.week 13. ...

  7. 2019-8-31-C#-通过-probing-指定-dll-寻找文件夹

    title author date CreateTime categories C# 通过 probing 指定 dll 寻找文件夹 lindexi 2019-08-31 16:55:58 +0800 ...

  8. MUI - 解决弹出输入法时页面高度变小导致底部上浮的问题

    解决弹出输入法时页面高度变小导致底部上浮的问题 在有输入框的页面,当输入法弹出的时候,底部元素上浮遮盖了输入框,影响页面美观及功能.查找了一下,页面变窄是不可避免的.即使是设置绝对固定也是不可以的.因 ...

  9. [iOS开发系列]根据Debug和Release状态的变化来屏蔽日志输出

    今天在这里分享一个很实用的小技巧. 我们平时在开发应用的时候,经常会用到NSLog来调试我们的程序,而随着项目越来越大,这些用于调试的日志输出就会变得很难管理. 我们在发布正式版的时候一定要屏蔽掉所有 ...

  10. asp.net如何判断网址能否打开

    private void StatusDescription_Click(object sender, System.EventArgs e)       {           PageUrl = ...