【问题标题】:On webpack, what are the accepted parameters of the webpackJsonp() function and what does it do?在 webpack 上,webpackJsonp() 函数接受的参数是什么,它的作用是什么?
【发布时间】:2018-07-16 18:55:15
【问题描述】:

我在 GitHub 存储库源中尝试了 searching 函数,但由于某种原因我找不到 webpackJsonp() 函数定义。

我知道我可以使用webpackJsonp([], null, ["moduleId"]) 通过 id 返回一个模块,但我想详细了解这个函数到底做了什么,并了解我能用它做什么。

编辑:我也想了解__webpack_require__.c__webpack_require__.m(在代码here 中找到一些cmets)。

【问题讨论】:

  • 其中一些,只有核心团队才能回答。关于需求函数:github.com/webpack/webpack/blob/master/lib/MainTemplate.js
  • 你可以用 webpackjsonp 做的事情并不多,这基本上只是 webpack 用来加载文件的,没有其他库自己操作。 Idk 正是您正在寻找的东西,但它类似于(更简单的版本):github.com/ronami/minipack/blob/master/src/minipack.js
  • 感谢@MatheusSilva,非常有帮助。似乎 .c 返回所有模块 ID,而 .m 返回这些模块的所有函数 ID?出于某种原因,某些 id 在 .c 和 .m 中重复
  • @MatheusSilva 基本上我在尝试理解并可能在使用 this code 之前对其进行自定义。
  • webpackJsonp 在 JsonpMainTemplatePlugin.js [webpack/lib/JsonpMainTemplatePlugin.js] 中生成。您可以在那里检查它或更好地观察项目中生成的一个。 plnkr.co/edit/xFT4ib5uHqkQ8XIrPqf3?p=catalogue(在这个 plunk html 中,我复制了项目中生成的 js)对细节不太感兴趣,但总的来说看起来很清楚。

标签: javascript webpack module


【解决方案1】:

根据 Petr 的评论,该函数似乎通常是使用这样的代码生成的:

  window["webpackJsonp"] = function webpackJsonpCallback(chunkIds, moreModules, executeModules) {
    // add "moreModules" to the modules object,
    // then flag all "chunkIds" as loaded and fire callback
    var moduleId, chunkId, i = 0, resolves = [], result;
    for(;i < chunkIds.length; i++) {
      chunkId = chunkIds[i];
      if(installedChunks[chunkId]) {
        resolves.push(installedChunks[chunkId][0]);
      }
      installedChunks[chunkId] = 0;
    }
    for(moduleId in moreModules) {
      if(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {
        modules[moduleId] = moreModules[moduleId];
      }
    }
    if(parentJsonpFunction) parentJsonpFunction(chunkIds, moreModules, executeModules);
    while(resolves.length) {
      resolves.shift()();
    }
    if(executeModules) {
      for(i=0; i < executeModules.length; i++) {
        result = __webpack_require__(__webpack_require__.s = executeModules[i]);
      }
    }
    return result;
  };

源码上的3个参数名称和cmets,很有见地。

【讨论】:

  • webpackJsonp是否也用于模块间共享代码?假设bundle-1bundle-2 都需要React,那么Webpack 将在两个包中包含React 还是使用webpackJsonp(或其他机制?)在bundle-1 和@ 之间共享React 987654330@?
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-11-04
  • 2015-08-21
  • 2011-05-13
  • 1970-01-01
相关资源
最近更新 更多