Webpack 与vite最大的不同，是在开发的时候，webpack 进行了模块转化。 Webpack的功能非常强大，比如模块打包、代码分割、按需加载、HMR、文件建ring、Tree-shaking、Sourcemap、MF、Dev Server、DLL、持久化缓存、Loader缓存等等
而Vite开发模式 unbundle， 因为浏览器原生支持esm，所以根本没做什么 bundle 操作，而是交给了浏览器。在生产的时候用才Rollup构建
原生ESM
先看看原生ESM支持的写法，比如，这种 js-examples，但是我实际运行的时候会碰到一个跨域问题
sql复制代码Access to script at 'file:///Users/nanlan/Documents/my-project/js-examples/module-examples/basic-modules/main.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.
报错原因是es6会受到同源策源的限制，所以需要通过HTTP或HTTPS协议从服务器加载你的脚本
js复制代码const express = require('express'); const app = express();
app.use(express.static('public')); // 'public'是你的静态文件（如HTML，JS，CSS等）所在的目录
app.listen(3000, () => console.log('Server is running on port 3000'));
然后运行localhost:3000就可以了
Webpack
在Webpack中，构建过程大概分为这么几个阶段初始化Init、构建Make、生成Seal
