关于静态文件目录引用问题

我们在项目中经常可能会这样遇到一些问题，需要在单页面项目中单独引用静态文件，然鹅，有一些静态的img，MP4等其它文件目录地址找不到？？

1.列如：静态文件 data.js

image.png

2.然后我们在项目中引用这个静态文件，使用require将每个静态文件引入

import data from "@/common/data.js";
  created(){
      //最好利用JSON.格式转换一次避免浅拷贝造成原数据篡改
      let newData = JSON.parse(JSON.stringify(data));
      for(var i = 0; i < newData .length; i++){
        newData [i].image = require("../images/" + newData[i].image);
        newData [i].videoUrl = require("../images/" + newData[i].videoUrl);
      }
  }

我们的静态文件就可以放在该页面的同级目录下如：

image.png