vue-cli lib模式打包umd分析

2020-09-01 16:00:38 阅读：507 来源： 互联网

标签：__ exports vue cli lib require factory module 模块

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

标签：__,exports,vue,cli,lib,require,factory,module,模块
来源： https://www.cnblogs.com/cyh1282656849/p/13596694.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

vue-cli lib模式打包umd分析