• 在开发模式下，Vite使用esbuild来进行最快速的本地构建。

  而到了生产模式下，Vite借助Rollup来打包和输出最后的资源，这里之所以没有用esbuild，是因为其还不支持code splitting等特性

• ES6 Module是JavaScript的原生模块特性，而目前绝大多数现代浏览器已经支持了这一模块语法。要启用它，我们只要在script标签中加入一个新的type属性：

  <script type="module" src=="src/index.js" ></script>
  

  浏览器会认为上面的index.js是一个ES6 Module，当检查到相关的模块语法后，浏览器会自动加载它所依赖的资源。仔细想想，这不正是之前由打包工具解决的一大问题吗？如果我们的工程源码都采用ES6 Module的形式来编写，那么就开始直接借助浏览器自身的模块支持去寻找依赖，而构建工具只需要负责代码的预编译等工作。

  虽然使用ES6 Module很方便，但目前它还只能在开发模式下启用。在生产环境中其最大的问题在于，很多时候我们是希望所有代码一起被加载进来的，而不是通过浏览器逐渐地来加载。实现一起加载会增加项目复杂度，对大多数的开发者来说可能并不友好，因此Vite也只在开发模式下才会开启该特性。

  除了使用浏览器来加载ES6 Module以外，Vite做的另一分布优化就是按需打包。当我们面对一个有几十个页面的庞大工程，而实际上只想调试其中的一个页面时，其实是没有必要将所有页面所需的模块统统打包一遍的。Vite通过提前获取所需要构建的依赖关系图，来分析出哪些是当前调试的页面所需的模块，并仅仅处理这一部分模块，通过这种方式来让本地开发效率进一步提高。

浏览器自己就支持esm, 那要esbuild干啥 #

要在服务器启动前找到所有的第三方依赖，然后通过 esbuild编译到.vite目录里，这样在服务器接收到用户 访问的时候，就可以直接返回了，不用去一个个请求了，减少HTTP请求次数

esbuild 编译前后有什么区别？ #

预编译前是多个文件，编译后是一个文件。多个模块变成一个模块，减少了http请求次数！！