模块不是loader必须有normal或pitch函数

Question

我正在使用作为 umd 模块分发的库，我导入的其中一个文件的代码如下所示

lib.js

(function (global, factory) {
    if (typeof define === "function" && define.amd) {
        define(['exports', '../utils/require-isdefined-plugin!lodash'], factory);
    } else if (typeof exports !== "undefined") {
        factory(exports, require('lodash'));
    } else {
        var mod = {
            exports: {}
        };
        factory(mod.exports, global.lodash);
        global.registry = mod.exports;
    }
})(this, function (exports, _lodash) {
    'use strict';
    // Library code
})

现在当我在我的代码和运行 webpack 中使用这个 lib.js 时，它会抛出这个错误

错误：模块 'H:\Projects\abc\umd\app\utils\require-isdefined-plugin.js' 不是加载程序（必须具有正常或间距功能）

我认为 webpack 将“../utils/require-isdefined-plugin”视为加载器并抱怨。

我的问题是如何让 webpack 知道这不是加载程序并正常执行此文件或

还有其他方法可以实现吗？

Answer 1

最简单且坦率地说最好的解决方案是使用不同的构建。现在大多数图书馆都有 UMD 构建以及 npm 包。

如果这不是一个选项，您可以使用 imports-loader to disable the AMD define as shown in Shimming - imports-loader，因此 webpack 不会触及它，并将使用 commonjs 版本。您将为库添加规则：

{
  test: require.resolve('./path/to/lib'),
  loader: 'imports-loader?define=>false'
}

require.resolve 与常规 require 的工作方式相同，但为您提供已解析模块的完整路径而不是其内容，因此您仍然可以执行 require.resolve('lib') 如果这是您的方式导入它。

为了安全起见，您还应该将库排除在常规 .js 规则之外，因为对同一个文件设置两个规则通常不会有好结果。您的规则可能如下所示：

rules: [
  {
    test: /\.js$/,
    loader: 'babel-loader',
    exclude: [/node_modules/, require.resolve('./path/to/lib')]
  },
  {
    test: require.resolve('./path/to/lib'),
    loader: 'imports-loader?define=>false'
  }
]

模块不是loader必须有normal或pitch函数

Module is not a loader must have normal or pitch function

webpack

umd

webpack-2