使用 webpack 对文件进行打包，从而让浏览器能够解析和执行模块化语法。
1、 按照下图结构创建项目目录
2、 在终端中运行命令，初始化项目并生成 package.json 文件
3、 修改 package.json 中的入口配置，指定 main.js 为程序主入口文件
4、 创建 add.js 文件，用于测试模块化语法是否可被正确处理
5、 编写 HTML 页面，并在其中引入 main.js；保存后右键选择“在浏览器中打开”以运行
6、 当前尚未使用 import/export 语法，但控制台已有输出，说明 JS 文件已被正常加载
7、 在 add.js 中按 ES Module 规范编写导出逻辑
8、 在 main.js 中通过 import 语句引入 add.js 并调用其导出的方法
9、 直接运行 index.html 会报错，原因是原生浏览器无法识别未编译的模块化语法
10、 在命令行中执行安装命令，引入 webpack 核心包及配套 CLI 工具
11、 安装完成后执行构建命令，自动生成包含打包后 main.js 的 dist 输出目录
12、 再次打开 index.html 仍提示错误，原因在于当前引用的仍是原始路径下的 main.js，需切换至打包后的资源路径
13、 将 index.html 中 script 标签的 src 属性修改为指向 dist/main.js（注意：原文中“man.js”应为笔误，实际为 main.js）
14、 此时刷新页面或重新打开 index.html，即可正常运行并看到预期结果
