疑问

vue-cli 创建的 vue2 + babel 项目，const 没有转为 var

解答：

基本上不会出现这种情况。

1. 如果是某个依赖里使用到了 es6，可以考虑将这个依赖添加到 vue.config.js 的 tranfileDependencies 选项。

2. 查看 babel 配置是否有误。

打包时，public 下除了 index.html，其它文件不会被自动打包到 dist 目录下吗？需要利用工具 copy 到打包目录下吗？

使用 vite 打包时，public 下的文件都被复制到打包后的 dist 目录下了。

使用 webpack 打包时，也会像 vite 把文件复制到 dist 目录下。

解答：

vue-cli-service 本身会使用 copy-webpack-plugin 插件，所以我们需要在它的功能上扩展。可以在 vue.config.js 里配置 chainWebpack 选项。

同理，vite 也使用了合适的 copy 插件。

怎么读取到用户写的配置文件，并根据读取的内容判断下一步该做什么？

可以要求用户的配置文件后缀为 .json，然后通过 fs.readFile(packagePath, 'utf-8') 来读取用户的配置。

如果配置文件使用 cjs 模块导出，也可以直接使用 require 引入，获取到用户的配置数据。

nodejs 支持 es 模块化吗？

node 从 8.5.0 版本开始，支持原生 es 模块。

这样，你就可以使用 import 来导入文件和库了。

你也可以导入 commonjs 模块，但是只能使用其默认导出（也就是 module.exports）的值。

怎么使用顶级 await？

只有使用 es 模块时才可以使用顶级 await。cjs 模块的导入是同步的，不需要顶级 await。

Node.js v14.8 开始支持顶级 await。

设置 tsconfig.json：

• module to es2022 (or higher)
• target to es2017 (or higher) or ESNext

package.json 中也需要设置 "type": "module"。

dependencies 和 devDependencies 有什么区别？

如果是开发一个项目，打包时在代码中引入的依赖模块都会被打包到最后的输出产物中。

如果是开发一个库，你上传到 npm 后。别人下载你这个库时，在 dependencies 中的依赖也会被下载，而在 devDependencies 中的依赖不会被下载。

了解强缓存与协商缓存

总结

1. 强缓存优先级高于协商缓存。
2. 第一次请求时，服务器在响应头中设置强缓存相关信息。第二次请求时，判断是否有本地的强缓存。有就取缓存，不会发请求；没有就发请求取服务器拿资源。
3. 第一次请求时，服务器也可以在响应头中设置协商缓存相关信息。第二次请求时，如果没有命中强缓存，那么就向服务器请求，并且请求头上会带有协商缓存相关信息。服务器根据协商缓存的信息，判断浏览器中的缓存是否失效。未失效，服务器就返回 304 的状态码，告诉浏览器继续使用本地的缓存。失效了，服务器就返回新的资源给浏览器。
4. 强缓存会设置缓存的有效期，用户在这一段时间内都不会去服务器去资源。
5. 协商缓存通过比较标识符，又服务器决定浏览器是否继续使用缓存。

强缓存和协商缓存是 Web 开发中用于优化网页加载速度和减少服务器负载的两种缓存机制。

1. 强缓存：

强缓存是通过设置 HTTP 响应头来实现的，服务器返回响应时会在 HTTP 头中包含缓存相关的信息。当客户端第一次请求资源时，服务器会将资源的过期时间（Expires）或者最大缓存时间（Cache-Control）一起返回给客户端。客户端在后续请求该资源时，会先检查本地缓存是否存在，并根据缓存规则来决定是否发送请求到服务器。如果资源的缓存未过期，客户端直接从本地缓存中加载资源，不再发送请求到服务器，这样可以大幅提高加载速度。

2. 协商缓存：

协商缓存是在强缓存失效的情况下才会发生的过程。当客户端发起请求时，服务器会返回一个带有缓存标识的响应头，如 ETag（实体标签）或者 Last-Modified（最后修改时间）。客户端在后续请求时会将这些标识信息带上，并放在请求头中发送到服务器。服务器会根据这些标识信息来判断资源是否有更新。如果服务器判断资源未发生变化，则返回状态码 304（Not Modified），告诉客户端可以继续使用本地缓存。客户端接收到 304 响应后，就会从本地缓存加载资源，减少了数据传输量和服务器的负载。

综合来说，强缓存优先级高于协商缓存。当强缓存生效时，客户端直接使用本地缓存，不与服务器进行交互；当强缓存失效时，客户端发送带有缓存标识的请求头到服务器，由服务器决定是否返回新的资源或者告诉客户端继续使用缓存。

这两种缓存机制可以结合使用，通过合理设置缓存相关的 HTTP 响应头，可以有效减少网络请求次数和数据传输量，提升网页的加载速度和性能。