这里分析的是打包后生成的.umd.js文件
- 最外部立即执行函数
(webpackUniversalModuleDefinition(root, factory){})() //立即执行参数一 root->(typeof self !== 'undefined' ? self : this) //立即执行参数二 factory参数中也是一个立即执行的匿名函数,参数为大量的模块key为模块名,value为具体模块内部 factory->function(__WEBPACK_EXTERNAL_MODULE__8bbf__){(function(modules){})({key:value,key:value,key:value......})}
- webpackUniversalModuleDefinition方法体
if(typeof exports === 'object' && typeof module === 'object')
//node
module.exports = factory(require("vue"));
else if(typeof define === 'function' && define.amd)
//AMD规范
define([], factory);
else if(typeof exports === 'object')
//commonJS规范
exports["netovue"] = factory(require("vue"));
else
//浏览器全局
root["netovue"] = factory(root["Vue"]);
- factory的执行
return /******/ (function(modules) { /******/ // webpackBootstrap /******/ // 缓存加载的模块 /******/ var installedModules = {}; /******/ /******/ // 获取指定id的模块 /******/ function __webpack_require__(moduleId) { /******/ /******/ // 检查模块是否已经加载过 /******/ if(installedModules[moduleId]) { /******/ return installedModules[moduleId].exports; /******/ } /******/ // 新建一个模块 (放入缓存) /******/ var module = installedModules[moduleId] = { /******/ i: moduleId, /******/ l: false, /******/ exports: {} /******/ }; /******/ /******/ // 调用模块自己的立即执行方法(通过call调用使其方法内的this指向module.exports) /******/ // 这里的参数传入了__webpack_require__其中包含了一些公用方法 /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ /******/ // 标记模块已经加载 /******/ module.l = true; /******/ /******/ // 返回目标模块 /******/ return module.exports; /******/ } /******/ //定义了一些公用的加载方法(获取已经加载的缓存、暴露的模块...) /******/ //返回加载的入口模块 /******/ return __webpack_require__(__webpack_require__.s = "fb15"); /******/ })