一、 打包服务端访问资源，直接build就行了
打包成服务器访问的资源，是默认的打包方式，直接运行自带脚本npm run build,就可以将资源打包在dist目录下
打包好之后的文件为dist目录下的：static与index.html
打包完之后直接扔服务器上就行了，直接运行
二、 打包成静态资源，build出问题啦！！
使用场景：
好比我写的是H5应用，放在浏览器上直接可以打开浏览，压根没用到后台服务，我再找个服务程序跑这个静态页面，是不是有点大材小用了
怎么解决呢？先看看原始打包好之后访问的都是啥？
- 直接打开
index.html，发现一片空白，别急，打开调试界面看看
发现这些css与js文件找不到，查找的路径是从c盘下面去找，这路径。。。把东西放在C盘下？可以是可以，但肯定不优雅，是吧
- 在去看看打包好之后的
index.html里面的东西是啥？
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<meta name=viewport content="width=device-width,initial-scale=1">
<title>androidvuejs</title>
<link href=/static/css/app.30790115300ab27614ce176899523b62.css rel=stylesheet>
</head>
<body>
<div id=app></div>
<script type=text/javascript src=/static/js/manifest.2ae2e69a05c33dfc65f8.js></script>
<script type=text/javascript src=/static/js/vendor.00d360f7b37e02379b40.js></script>
<script type=text/javascript src=/static/js/app.5c58753d836efece630f.js></script>
</body>
</html>
大眼一扫，发现只有一堆链接，全部去找css文件与js文件，而且路径为/，也就是从根目录找起，也就是说如果打包好的静态资源不是放在服务程序上跑的情况下，他是去从c盘目录下去找静态资源，如果在服务程序上跑，则是去服务程序的资源路径查找。
问题发现了，如何解决呢？？
- 简单粗暴点：我直接把这些
/手动改成./，也就是当前路径 - 手动改完之后如下：
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<meta name=viewport content="width=device-width,initial-scale=1">
<title>androidvuejs</title>
<link href=./static/css/app.30790115300ab27614ce176899523b62.css rel=stylesheet>
</head>
<body>
<div id=app></div>
<script type=text/javascript src=./static/js/manifest.3ad1d5771e9b13dbdad2.js></script>
<script type=text/javascript src=./static/js/vendor.00d360f7b37e02379b40.js></script>
<script type=text/javascript src=./static/js/app.5c58753d836efece630f.js></script>
</body>
</html>
然后打开index.html，发现确实访问成功啦，打开控制台一看，css与js文件也都找到啦
问题到此就解决了，但是！每次手动改，感觉也不是很优雅，手动比较没有全自动舒服是吧！
-
于是乎，我感觉，从
node打包静态资源的脚本上，应该可以解决打包路径方式
-
node打包脚本在config 文件下的index.js中的build中进行配置
然后我大眼一扫就发现了，打包路径配置属性：assetsPublicPath: '/',好家伙，果断把/改为./，然后执行build进行打包
好家伙！问题非常优雅的解决啦！
转载：https://blog.csdn.net/qq_39150356/article/details/116757109
查看评论