vue打包后，静态资源通过URL访问不到

vue打包后，一些静态资源通过URL访问不到

---

今天写微信转发，需要直接用url写分享图片的地址。不是第一次写微信转发了，以前都是我自己手copy到服务器上，发一版就要copy一次，烦不胜烦。

const shareInfo = {
    title: '微信转发',
    desc: '微信转发测试\r\n 微信转发测试',
    link: "https://www.xxxxxx.com",
    imgUrl: 'https://www.xxxxxx.cn/static/img/share.jpg'
}  

分享标题和描述成功了，但是图片没有出现。直接访问这个图片地址，显示大大的404，那肯定是图片地址错了。

然后就开始找原因，查看了打的包里的图片文件夹，并没有找到 share.jpg。但是发现其他的图片文件都是以 a.7a2c09b.jpg形式出现的。那分享图片在哪里呢?会不会也变成share.jh65465.jpg?

网上查资料，知道可能的原因：

1. vue打包图片时，一些小的图片会被直接转为base64，存在指定的css中，所以我们找不到share.jpg相关的资源。

2. share.jpg打包后变成了share.随机数.jpg

总之，就是vue自身的打包机制把share.jpg弄没的。那打包的时候可不可以不处理特定的静态资源呢？

可以，放在src同级的static文件中，打包时不处理其中的文件

然后打包，看打包文件

有了，放服务器上也可以通过https://www.xxxxxx.cn/static/share.jpg访问到了。

有一点小毛病，可改可不改。我们打包的其他图片资源都在static > img文件夹下的。一张图片和static、index.html同级。那以后像share.img之类的但不限于图片的资源多了呢？吃藕。

反正都是图片打包后就都放在img下就顺眼了。就在static文件夹下建img文件，把share加进去。然后打包，看

当然，这样访问路径也变掉了，多了一个img层： https://www.xxxxxx.cn/static/img/share.jpg

说了一大堆，大部分都是过程，其实就一句：

打包发布后，还想用url访问到特定的静态资源，就把静态资源放在src同级的static下