webpack学习笔记——打包js

小程序：扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序

1.新建一个入口js文件，如entry.js，代码如下：

document.write("It works.")

2.然后编译 entry.js 并打包到 bundle.js(会自动生成)，在cmd中找到当前entry.js目录下，执行如下命令：

webpack entry.js bundle.js

用浏览器打开 html页面 将会看到 It works.

3.接下来增加一个模块module.js，需要修改入口

document.write('It works.');
document.write(require('./module.js'));//添加模块

4.再次编译entry.js并打包到bundle.js

webpack entry.js bundle.js

Webpack 会分析入口文件，解析包含依赖关系的各个文件。这些文件（模块）都打包到 bundle.js 。

Webpack 会给每个模块分配一个唯一的 id 并通过这个 id 索引和访问模块。

在页面启动时，会先执行 entry.js 中的代码，其它模块会在运行 require 的时候再执行。