require的一个用法

    <li v-for="item in verticalList" :key="item.icon" @click="handleClick(item)" :class="{clicked: item.clicked}">
        <img :src="item.icon" style="width: 16px; height: 16px; margin-left: 4px;" />
        <div>{{item.content}}</div>
      </div>
      <div class="content" v-else>
        <img :src="item.icon" style="width: 16px; height: 16px; margin-left: 4px;" />
        <div>{{item.content}}</div>
      </div>
    </li>
  </ul>
  
  data() {
  return {
      verticalList: [{
            icon: "back",
            content: "撤销",
            code: "undo",
            icon: require('../../../../../../assets/svg/cancel.svg')
          },
          {
            icon: "download",
            content: "下载",
            code: "download",
            icon: require('../../../../../../assets/svg/download.svg')
          },
          {
            icon: "frameSelection",
            content: "框选",
            code: "frameSelection",
            icon: require('../../../../../../assets/svg/frameSelection.svg')
          }
  }

直接写图片的路径,打包编译后会找不到路径,以为经过特殊处理了,要写成require('../../pic.png')