[reactjs] configuration.module에 알 수없는 ‘loaders’속성이 있습니다.

Program / 글쓴이

내 오류 출력 :

잘못된 구성 개체입니다. API 스키마와 일치하지 않는 구성 오브젝트를 사용하여 웹팩이 초기화되었습니다. -configuration.module에 알 수없는 ‘loaders’속성이 있습니다. 객체 {exprContextCritical ?, exprContextRecursive ?, exprContextRegExp ?, exprContextRequest ?, noParse ?, rules ?, defaultRules ?, unknownContextCritical ?, unknownContextRecursive ?, unknownContextRegExp ?, unknownContextRequest ?, unsafeCache ?, wrappedContextCritical ?, wrappedContextRecursive ?, wrappedContextRecursive? ?, 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@4.1.1

답변

당신은 변경해야합니다 loaders에 rules웹팩 4 :

변화:

loaders

에:

rules

소스 : 로더

예:

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

답변

rules대신 웹팩 4에서 사용하십시오 loaders.

https://webpack.js.org/concepts/loaders/

답변

위의 답변이 작동하지만 webpack 및 webpack-dev-server 버전을 다음과 같이 변경 하여이 문제를 해결할 수 있습니다 

"webpack": "3.8.1",
"webpack-dev-server": "2.9.4"

문제를 해결할 수도 있습니다. 그것이 도움이되기를 바랍니다.

답변

마이그레이션 유틸리티 를 사용 하여 webpack 구성 파일을 마이그레이션해야합니다.

이주 문서는 유용합니다.

답변

webpack.config.js 아래에서 나를 위해 일하기

module.exports = {
    entry: [
        '.src/index.js'
    ],
    output:{
        path: __dirname,
        filename: 'app/js/main.js'
    },
    module:{
        rules: [
          { test: /\.css$/, use: 'css-loader' },
          { test: /\.ts$/, use: 'ts-loader' }
        ]
    }
}

답변