提供各种框架信息：

nodejs是javascript的一个运行环境，webpack也是运行在nodejs中。

模块化导入导出

1.通过nodejs的require和module.export （commonjs）将文件导入导出。
2.commonjs是node.js项目的绝佳模块拆分方案，但浏览器不支持模块化(commonjs在浏览器上无法使用)
3.浏览器使用模块化，通过requirejs或browserify编写能够在浏览器中运行的模块代码，requirejs代码如下：
image.png
通过define暴露方法，参数一：数组 定义依赖与那个模块，参数二：回调函数 返回要暴露的方法
使用时需要导入对应 require.js文件

  1. <script src="https://cdn.bootcdn.net/ajax/libs/require.js/2.3.6/require.min.js"
  2.   data-main="用于加载入口文件"
  3.   ></script>

入口文件中：
导入依赖的模块，通过回调函数执行依赖模块中的暴露方法
image.png
4.模块正在成为ECMAscript的官方标准
通过export default 暴露方法属性
image.png
通过import 导入使用，需要给script标签加上type属性，并赋值为module，让浏览器知道这是模块化导入
image.png
这样直接使用可能会有跨域问题

  1. //通过命令启动一个服务
  2. npx http-server

这时在这个服务端口下，点击对应文件会得到结果
5.webpack可以帮助打包，且同时支持esmodule和commonjs的模块化，还可以扩展，支持很多静态资源包。
6.webpack的竞争对手
image.png
构建一个简单的库，且要很快运行起来，可以使用PARCEl
构建一个类库，且需要导入少量的第三方库，可以使用rollup
构建一个复杂应用，导入大量第三方库，同时支持es6和commonjs的模块化，还要拆分代码，还要使用静态资源文件，只能使用webpack

Vite，基于esmodule的构建方式，与vue3完美结合