1. 概念

webpack 是JavaScript 应用程序的模块打包器,可以把开发中的所有资源（图片、js文件、css文件等）都看成模块，通过loader（加载器）和plugins （插件）对资源进行处理，打包成符合生产环境部署的前端资源。所有的资源都是通过JavaScript 渲染出来的。

如果一个页面大部分是script标签构成，80%以上是webpack 打包。

2. 格式

!function ("形参"){"加载器"}("模块")
模块有数组和对象两种形式，无论哪种传的都是函数

当你在分析js时看见内容中类似有window["webpackJsonp"]和push等这样的关键字，那么这份js代码就是使用了webpack。

3. 数组形式

!function (e) {
    var t = {};
    // 加载器  所有的模块都是从这个函数加载 执行
    function n(r) {
        if (t[r])
            return t[r].exports;

        var o = t[r] = {
            i: r,
            l: !1,
            exports: {}
        };
        return e[r].call(o.exports, o, o.exports, n),
            o.l = !0,
            o.exports
    }
    n.m = e
    n(0)
}
([
    function () {
        console.log('123456')
    },
    function () {
        console.log('模块2')
    },
])

4. 对象形式

!function (e) {
    var t = {};

    // 加载器  所有的模块都是从这个函数加载 执行
    function n(r) {
        if (t[r])
            return t[r].exports;

        var o = t[r] = {
            i: r,
            l: !1,
            exports: {}
        };
        return e[r].call(o.exports, o, o.exports, n),
            o.l = !0,
            o.exports
    }

    n.m = e
    n('key1')
}
(
    {
        'key1': function () {
            console.log('我负责登入')
        },
        'key2': function () {
            console.log('我负责注册')
        }
    }
)

怎么扣

• 先扣整个加载器
• 再扣对应的模块
• 模块内的方法可以通过exports导出，也可以通过外层定义var变量名导出