在用vue-router构建项目时千万不要用a标签代替router-link标签，会变得不幸

待业在家，闲来无事。

用vue-cli写了一个没什么技术含量的页面框架，实现了一些小小的页面效果。

然后突然来了想法，想把这个项目部署到前段时间买的云服务器上看看，然后问题就出现了。

打包完vue-cli项目，自己本地打开看，居然打不开！！！（资源路径统统404）
看了眼打包出来的东西，所有的资源路径，都是那么的原汁儿原味儿。

经过排查我发现，在资源路径前加个打包文件夹名称就能解决那条资源路径404的问题，但那么多资源路径一条条搞我怕不是要累死。

人嘛，总是喜欢偷懒，作为懒狗当然要找出一次性就能解决重复劳动才能解决的方法。

说到vue-cli，在之前做毕设改bug的时候就了解到这个所谓的vue-cli和webpack有挺深的渊源，简单来讲就是用webpack构建的一个vue项目脚手架，而webpack本身就是个用来方便打包的工具。要想知道怎么解决这些问题，自然就需要去学一学个个玩意儿。

简单过了一遍webpack的教程，突然发现之前看不太懂的vue-cli配置指南，能看懂了一点。

害，废话了这么多，总而言之需要创建一个vue.config.js，配置一个publicPath，将publicPath配置为当前默认打包生成的文件夹的名字就行。于是页面的问题就解决了。

但是！！！这个故事还没有完结，不然也不会有这个标题了。

我尝试将页面分为Login和main两个大的主体，利用嵌套路由实现登录界面和操作界面的跳转。为了省事，就简单在Login界面写了个a链接跳转到main界面，这个操作在本地的node服务器上还是能够执行的。但当我打包部署到服务器，不行了！！！

点击链接只是访问了原来赋给a标签href的值，href的值没有被打包成publicPath所要的前缀路径。关于原因呢，我也不太清楚，但我知道main界面的router链接能够成功被打包成对应的格式，那么既然router能被成功打包那自然应该“用魔法打败魔法”，将a标签换成router-link就解决问题了。

最后有人看到的话我就顺便宣传一下我搭的MC服务器：1.16.5版本纯净服 地址jingjishiyong.xyz 。我家还蛮大的，可以直接睡觉（doge）