RequireJS:将插件动态应用于模块id

RequireJS: apply plugin to module id dynamically

本文关键字：应用于 模块 id 动态 插件 RequireJS      更新时间：2024-04-17

我使用的是requirejs babel插件，它需要为所有需要babel转换的模块ID预先添加'es6!'。

define(['es6!some-es6-module'], function(module) {
  // ...
});

RequireJS中是否有API允许我检查模块id并根据需要准备插件id？例如，如果我想将'es6!'应用于特定目录中的所有模块ID？

最终，我需要能够编写这样的定义define(['some-es6-module'], ...)，并根据模块id自动添加es6!前缀

  • 不查找有关SystemJS的信息，也不查找提前进行转换的gullow任务等
  • 具体的模块ID在配置时还不知道——我只知道在某些位置/目录中，模块需要es6!
  • 需要在运行时在浏览器中工作

我不能100%确定您的总体目标（您希望永久保存添加到模块ID的es6还是始终自动添加？），但您可以使用RequireJS映射来替换已定义模块的模块ID。例如：-

requirejs.config({
    map: {
        // * - for all modules that require these, do this
        '*': {
            'some-es6-module': 'es6!some-es6-module'
        }
    }
});

然而，考虑到您的用例，您可能需要比这更复杂的东西，因为映射假设您有实际不同版本的文件，并且通常用于此目的。

我认为您希望避免的一个更复杂的解决方案可能是在r.js中优化文件并通过Node加载/编辑文件之前动态循环文件。它会变得有点乱！

var config = requirejs.s.contexts._.config;
var needBabel = ['some-es6-module', 'another-module-name', 'another'];
for (var property in config.paths) {
    if (config.paths.hasOwnProperty(property) && needBabel.indexOf(property) > -1) {
        // load the module in node
        // fs.readFileSync(__dirname + config.paths[property] + '.js');
        // dynamically modify this file with text replacement
        // save this file via Node again
    }
}
// run Require JS optimiser
// undo everything you've just done when optimisation is complete

我最终覆盖了load方法。覆盖使用具有映射路径的模块的标准加载，否则使用es6（requirejs-babel）插件加载模块。

require.standardLoad = require.load;
require.load = function(context, moduleName, url) {
  var config = requirejs.s.contexts._.config;
  if (moduleName in config.paths) {
    return require.standardLoad(context, moduleName, url);
  }
  require(['es6'], function(es6) {
    es6.load(
      moduleName,
      require,
      {
        fromText: function(text) {
          require.exec(text);
          context.completeLoad(moduleName);
        }
      },
      {});
  });
};

它在这里发挥作用：https://gist.run/?id=7542e061bc940cde506b

相关文章：