vue-cli lib模式打包umd分析

這里分析的是打包后生成的.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");
  /******/ })