vue项目打包给后端遇到的问题

一、资源路径问题 （绝对路径、 相对路径）

打包上传到服务器时，前端代码不能使用绝对路径，然而默认打包后的html、js、css等文件使用的都是绝对路径，所以我们要在打包之前将绝对路径改为相对路径再打包。

首先理解两个概念：
1.什么是绝对路径
以根目录为起点到某一个目录的路径，能够完整描述文件所在位置（在硬盘上真正的路径）的路径就是绝对路径。
例如：c:/test/index.htm
网页中以http开头的链接都是绝对路径
2.什么是相对路径
从一个目录为起点到另外一个目录的路径
例如： …/test1/index.html

注：	 ./    代表当前所在的目录
		../   代表上一层目录
		/     代表根目录

区别
在开发中很少会使用绝对路径，上传到web服务器上浏览会出现问题。通常在网页里指定文件时使用相对路径。只要两个文件的相对位置没有改变，还在同一个目录内，那么无论上传到服务器的任何位置，都可以正确的显示。

如何将绝对路径改为相对路径?
在vue.config.js文件中，将publicPath:’/’ 改为 ‘./’

// publicPath: '/',//把配置的static文件夹当成了根路径，
  publicPath: './',

注： vue2.0 和vue3.0 改的位置可能会有区别 assetsPublicPath: ‘./’

背景图片的引用问题
目前没有遇到这个问题，暂时不做记录。网上其他人说是改 publicPath:’…/…/’

二、页面空白

打包放到服务器上之后页面打开是空白，首先检查是否是路径问题，如果路径没有问题，资源都能加载，那么就去检查路由模式。
前端路由的两种模式：
mode:‘hash’ //url带有#
mode:‘history’
router/index.js 路由配置默认的模式是hash，改为history模式需要后端配合，在服务端加一个覆盖了所有情况的候选资源，否则就会导致页面空白。

history模式与hash模式的区别
1.hash模式
通过改变锚点(#)更新URL，不会触发页面重新加载，可以通过window.onhashchange来监听hash的变化，无刷新跳转。
在hash模式下，所有的页面跳转都是客户端进行操作，因此对于页面拦截更加灵活；但每次url的改变不属于一次http请求，所以不利于SEO优化。
2.history模式
history模式改变url会导致浏览器向服务器发送请求，所以需要在服务器端做处理：如果匹配不到任何静态资源，则应该始终返回同一个 html 页面。

三、一些浏览器不支持es6语法，造成编译错误

目前没有遇到过，暂不做记录