Vue中public 与 assets 目录的区别@expansion---low_level

public 与 assets 目录的区别

public

public放不会变动的文件

  • npublic/ 目录下的文件并不会被Webpack处理:它们会直接被复制到最终的打包目录(默认是dist/static)下。必须使用绝对路径引用这些文件,
  • 这个取决于你vue.config.js中publicPath的配置,默认的是/。
  • 任何放置在 public 文件夹的静态资源都会被简单的复制,而不经过 webpack。你需要通过绝对路径来引用它们。

assets

assets放可能会变动的文件

  • assets目录中的文件会被webpack处理解析为模块依赖,只支持相对路径形式。

  • 注意我们推荐将资源作为你的模块依赖图的一部分导入,这样它们会通过 webpack 的处理并获得如下好处:

  • 简单来说就是就是public放别人家js文件(也就是不会变动),assets放自己写的js文件(需要改动的文件)

  • 脚本和样式表会被压缩且打包在一起,从而避免额外的网络请求。

  • 文件丢失会直接在编译时报错,而不是到了用户端才产生 404 错误。

  • 最终生成的文件名包含了内容哈希,因此你不必担心浏览器会缓存它们的老版本。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YTM3V7dd-1571394948079)(Vue中public 与 assets 目录的区别@expansion---low_level])