vue assets与static的区别

vue assets与static的区别

assets中的文件会经过webpack打包，重新编译，推荐在assets存放js等需要打包编译的文件。
static中的文件，不会打包编译。static中的文件只是复制一遍。static中建议放一些外部第三方文件，自己的放assets里，别人的放static中。（图片推荐放在static里）

在assets与static中放图都可以使用；但动态绑定，assets路径的图片会加载失败，因为webpack使用的是commenJS规范，必须使用require才可以，代码如下：

  <div>
    <p>直接使用</p>	//直接使用都可以
    <img src="../../assets/assets1.png" title="assets的图片">
    <img src="../../../static/static1.png" title="static的图片">
    <p>动态绑定</p>  //动态绑定路径static可以直接用，assets需要用require（括起来）
    <img :src="assetsurl" title="assets的图片">
    <img :src="staticurl" title="static的图片">
  </div>

data (){
      return {
        assetsURL: require('../../assets/assets1.png'),
        staticURL: '../../../static/static1.png'
      }
    }