40-static和assets的区别

相同点：不管是static还是assets里边的图片如果在html中使用，都是可以的。

<!-- assets文件下的 -->
<img src="../../assets/img/starS.png" alt="">  <!--直接使用-->
<img :src="starSUrl" alt="">  <!--通过import引入-->

<!-- static文件下的 -->
<img src="../../../static/img/half.png" alt="">
<img :src="halfUrl" alt="">

不同点：使用assets下面的资源，在js中使用的话，路径要经过webpack中file-loader编译，路径不能直接写。assets目录下的资源必须使用import或require()引入

<script type="text/javascript">
import starS from "../../assets/img/starS.png";
import half from "../../../static/img/half.png"
import star from "../../assets/img/star.png";
export default {
  name: "Rate",
  data() {
    return {
      starSUrl:starS,
      halfUrl:half,
      starUrl:star,
    }
}

if (stars >= i + 1) {
  // this.starsUrlArr.push("./static/img/starS.png");
  //等同于
  this.starsUrlArr.push(require("../../assets/img/starS.png"));
  //等同于
  this.starsUrlArr.push(this.starSUr);
} 
</script>

总结：如果是在HTML中使用的话，无论是assets文件还是static文件中都可以直接用或者是import引入以后绑定src用；如果是js中使用的话，static下的可以直接引入路径，但是assets文件下的需要用require()或者import引入。
assets中的文件会经过webpack打包，打包后会生成dist文件夹，重新编译，推荐该方式。而static中的文件，不会经过编译，static中的文件只是复制一遍而已。简单来说，自己的放到assets，别人的放到static中。