本文是自己总结用的，大家可以当做参考，但是由于自己的水平有限，文档中一定会存在不合理的或者错误的地方，请大家见谅，友好观看。
如果您对某个地方有疑问，或者有更好的见解可以在评论区提出来，大家一起进步，非常感谢！
一， Vue的public和assets文件夹的不同
Public文件夹（static）
public文件夹中的内容在打包的时候，会被原封不动的移动到dist目录中
Assets文件夹
assets文件夹中被使用到的资源(没有被使用到的文件并不会被放进dist文件夹中)在打包时，会被webpack处理。由 webpack 的配置文件决定将资源放置到哪里。并且经过webpack 处理过的资源都会被加上哈希的文件名后缀，这是为了更好的应对浏览器的缓存。（有时候替换一张图片，还使用原来的名字，如果没有webpack加上这样一个动态的哈希值的话，浏览器会直接使用缓存中的图片，导致替换了之后却没有效果
二，Vue对相对路径和绝对路径的处理
使用绝对路径
当我们想要使用public文件夹中的资源时，可以使用绝对路径的形式来请求资源。Vue在识别路径时发现是一个绝对路径，URL会被直接的保存下来放到img的src属性下。代码更改之后，Vue热更新将最新的dist文件交给浏览器去识别。浏览器在解析img DOM时，直接去请求img/aaa.jpg.。
因为public文件夹中的内容会被原封不动的添加到dist 文件夹中，所以可以正确的请求到图片资源。
使用相对路径
我们想要使用assets 文件夹中的内容时，需要使用相对路径的形式来请求资源。Vue在识别路径时发现是一个相对路径，会路径进行解析。
官方文档的解释：
我们写代码的时候我们在引用文件的时候开发者所关注的目录结构是编辑器打开的这个项目文件夹。但是浏览器在识别代码时，浏览器识别的是打包后的dist文件夹。在我们使用相对路径来引入资源时，如果Vue没有对路径做处理，而是直接交付给浏览器，那么浏览器一定找不到对应的文件。所以Vue在将这部分结构打包到dist文件夹之前一定是做了一些处理，让浏览器能正确的找到资源。
Vue 所做的处理就是针对相对路径调用了一次require函数。
node使用的是CommonJS规范，require 语句作为 node 规范下的模块导入函数。平时在项目中使用比较多的 import … from … 是ES6的模块规范。
官方推荐：使用相对路径的形式来导入资源
何时使用public文件夹：
三， 使用axios来请求本地数据
平时在自己mock数据的时候发现的问题。自己写的本地JSON文件在使用axios和fetch进行请求时，必须放在public文件夹下，并且使用绝对路径来请求。
在使用相对路径进行请求时，发现会找不到资源并且路径并没有经过require语句进行处理。
官方文档只是明确说明这这三种情况下Vue会对相对路径进行处理。个人猜测是Vue不会对Axios中的相对路径进行处理。所以以后出现这种请求资源找不到的时候，可以先去浏览器看一下请求的路径，如果发现是因为没有被 Vue 处理而找不到文件的话，可以尝试使用require 语句来手动处理一下。
四， Require()函数
- CommonJS规范是同步的加载，会出现浏览器假死的状态，因为是同步的加载，所以完全可以当做同步代码来使用
- 加载JSON等数据时，返回值就是得到的数据。加载图片等资源时，返回值是一个处理过的路径。
- Require中只能填写相对路径
想要在require中填写 绝对路径的方式来访问 public 文件夹中的内容是行不通的，个人理解如下。Require是 node 提供的api。浏览器是不会识别require语句的。所以在打包 dist 完成之前。Require语句就被执行了，得到了处理过后的字符串。在打包完成之前当前的文件结构就是我们开发者创建的项目。Require会基于这个来识别路径；。所以使用绝对路径来访问public中的文件是行不通的。 这个现象和axios中只能使用绝对路径也是类似的。识别axios中的路径这一步是在浏览器的环境下执行的，浏览器得到的是dist文件夹，所以在axios中也只能通过绝对路径的形式
