用 v-bind 设置 img.src 后，webpack 不会翻译链接答案

【问题标题】：After setting img.src with v-bind, webpack will not translate the link用 v-bind 设置 img.src 后，webpack 不会翻译链接
【发布时间】：2019-01-12 08:29:04
【问题描述】：

我正在使用 vue-cli-2.9.3 创建 webpack 模板而不更改任何默认设置。

当我尝试链接到我的组件中的一些imgs时，例如

<template>
  <div>
      <img src="../assets/p1.jpeg">
      <img src="../assets/p2.jpeg">
  </div>
</template>

这个img 将被翻译成<img src="/static/img/p1.3b03bfb.jpeg"> 并且这工作正常。但我想用 v-bind 设置 src:

<template>
  <div>
      <img :src="`../assets/p${number1}.jpeg`">
      <img :src="`../assets/p${number2}.jpeg`">
  </div>
</template>

当然，number1 等于 1，number2 等于 2。

这个img 将被翻译成<img src="../assets/p2.jpeg">。因此，浏览器无法在 finally 项目中找到资源。如何解决这个问题？

【问题讨论】：

标签： vue-cli

【解决方案1】：

解决方案：

使用require来分析img url。

<img :src=“require(../assets/p${number1}.jpeg)”>

【讨论】：