vue 打包之后拿不到 原先 static 文件里的 图片

vue 打包之后拿不到 原先 static 文件里的 图片

关于vue 打包是一个 困扰了很多初学者的问题，当然包括我。不过vue-cli 已经优化的很好

关于路径问题，百度上有很多，就是在

修改：

这个文件下的

  build :   {

     // Template for index.html

    index :   path . resolve ( __dirname ,   ' ../dist/index.html ' ) ,

     // Paths

    assetsRoot :   path . resolve ( __dirname ,   ' ../dist ' ) ,

    assetsSubDirectory :   ' static ',

    assetsPublicPath :   ' / ',   //   ==>  './'

确实能将打包以后的资源路径指向打包以后的文件夹。但是我使用 静态文件路径的 却拿不到

imgSrc : [

' /static/img/footer/tab11.png ' ,

' /static/img/footer/tab21.png ' ,

' /static/img/footer/tab31.png '

]

这种路径的一个算一个，都拿不到。

然后看打包以后的文件结构，发现只需要在路径变成相对路径

imgSrc : [

' . /static/img/footer/tab11.png ' ,

' ./static/img/footer/tab21.png ' ,

' ./static/img/footer/tab31.png '

]

就能拿到。

但是当我修改标签上的 static（不要问我为什么要在标签上使用 static 文件里的东西，当时脑抽）

为

< img slot = " icon " src = " ./static/img/footer/tab4.png " >

结果报错了。。。打包也会报一堆错

然后想着既然这样，索性破罐子破摔，把这个改成 绑定的属性

< img slot = " icon " : src = " '. /static/img/footer/tab4.png ' " >

就能拿到了。