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