javascript - vue-lazyload 路径问题

Question

请教一个问题:

目录
__ src
  |_ assets
     |_imgs
        |_ imgloading.gif
        |_ imgerror.jpg
__ static
  |_ imgloading.gif
  |_ imgerror.jpg

// src/main.js
Vue.use(VueLazyload, {
  error: './assets/imgs/imgerror.jpg',
  loading: './assets/imgs/imgloading.gif',
  preLoad: 1,
  attempt: 1
});

执行npm run dev在浏览器中报错http://localhost:8080/assets/images/.... 找不到，把上面的路径改成/src/assets/imgs/imgerror.jpg同样报错。
然后我把图片放在与src同级的文件夹static下面，改写代码：

// src/main.js
Vue.use(VueLazyload, {
  error: '../static/imgerror.jpg',
  loading: '../static/imgloading.gif',
  preLoad: 1,
  attempt: 1
});

图片就可以加载成功，想到很久没上面头绪。

Answer 1

./assets/imgs/imgerror.jpg这个看你目录里面是没有imgs文件夹的

Answer 2

说是在模板中的路径会被webpack解析，而js中的路径需要通过import、require引用或将图片放在static下面参考

Answer 3

require('./assets/imgs/imgerror.jpg')