3

我正在使用 Webpack 2。我为这个项目编写了一个自定义加载器并将其放入./webpack-tools/loaders/my-custom-loader.js. 加载程序如下所示：

module.exports = function myCustomLoader(input) {
    // Logic for my custom loader
    return stringWithTransformedJS;
};

我试图配置我webpack.config.json使用这个自定义加载器：

// ...
resolveLoader: {
  modulesDirectories: ['./webpack-tools/loaders'],
  extensions: ['.js']
},
module: {
  loaders: [
    // ...
    {
      test: /\.less$/,
      loader: 'myCustomLoader!less'
    },
    // ...
  ]
},
// ...

当我尝试构建我的项目时，我收到以下错误（已清理以删除有关我的项目的识别信息）：

SyntaxError: Unexpected token ILLEGAL
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:373:25)
    at Module._extensions..js (module.js:416:10)
    at Object.require.extensions.(anonymous function) [as .js] (/home/kevin/Programming/my-project/node_modules/babel-register/lib/node.js:154:7)
    at Module.load (module.js:343:32)
    at Function.Module._load (module.js:300:12)
    at Module.require (module.js:353:17)
    at require (internal/module.js:12:17)
    at Object.<anonymous> (/home/kevin/Programming/my-project/src/a-file-that-imports-a-LESS-file.js:1:1)
    at Module._compile (module.js:409:26)
    // remainder of stack trace removed for conciseness

（我必须承认，我发现此错误消息非常无用。消息“SyntaxError: Unexpected token ILLEGAL”并没有给我任何线索，而且我的自定义加载程序没有出现在完整跟踪中的任何位置。）

我尝试了几种不同的方法来引用我的自定义加载器webpack.config.js，包括：

resolveLoader: {
  alias: {
    myCustomLoader: require.resolve(path.join(__dirname, './webpack-tools/loaders/my-custom-loader.js'))
  }
},

和：

module: {
  loaders: [
    // ...
    {
      test: /\.less$/,
      loader: './webpack-tools/loaders/my-custom-loader.js!less'
    },
    // ...
  ]
},

但是无论我使用哪种配置，我都会遇到相同的错误。

如何在我的 Webpack 2 项目中正确包含我的自定义加载器？

4

0 回答 0