1. ホーム
  2. reactjs

[解決済み] configuration.module に未知のプロパティ 'loaders' があります。

2022-02-05 23:37:45

質問

エラーメッセージが出力されます。

無効な設定オブジェクトです。Webpackは以下のオブジェクトを使用して初期化されました。 API スキーマに一致しない設定オブジェクトがあります。 - configuration.module に未知のプロパティ 'loaders' があります。これらのプロパティは有効です: object { exprContextCritical? exprContextRecursive?、exprContextRegExp?、exprContextRequest? noParse?, rules?, defaultRules?, unknownContextCritical? unknownContextRecursive?、unknownContextRegExp? unknownContextRequest?、 unsafeCache?、wrapContextCritical? wrappedContextRecursive?, wrappedContextRegExp? strictExportPresence?, strictThisContextOnImports? } -> オプション 通常のモジュールに影響を与える ( NormalModuleFactory ).

私のwebpack.config.jsです。

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, 'src/client/public');
var APP_DIR = path.resolve(__dirname, 'src/client/app');

var config = {
  entry: APP_DIR + '/index.jsx',
  module : {
    loaders : [
      {
        test : /\.jsx?/,
        include : APP_DIR,
        loader : 'babel-loader'
      }
    ]
  },
  output: {
    path: BUILD_DIR,
    filename: 'bundle.js'
  }

};


module.exports = config;

私の webpack のバージョンです。

[email protected]

解決方法は?

を変更する必要があります。 loaders から rules を webpack 4 で実装しました。

を変更します。

loaders 

になります。

rules

のソースになります。 ローダー

module.exports = {
  module: {
    rules: [
      { test: /\.css$/, use: 'css-loader' },
      { test: /\.ts$/, use: 'ts-loader' }
    ]
  }
};