configuration.module memiliki properti 'loader' yang tidak dikenal

136

hasil kesalahan saya:

Objek konfigurasi tidak valid. Webpack telah diinisialisasi menggunakan objek konfigurasi yang tidak cocok dengan skema API. - configuration.module memiliki properti 'loader' yang tidak dikenal. Properti-properti ini valid: objek {exprContextCritical ?, exprContextRecursive ?, exprContextRegExp ?, exprContextRequest ?, noParse ?, rules?, DefaultRules?, Tidak diketahuiContextCritical? ?, strictExportPresence ?, strictThisContextOnImports? } -> Opsi yang memengaruhi modul normal ( NormalModuleFactory).

webpack.config.js saya:

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;

versi webpack saya:

webpack@4.1.1

reactjs webpack

— S.M_Emamian
sumber

317

Anda harus mengubah loaderske rulesdalam webpack 4:

perubahan:

loaders

untuk:

rules

sumber: Loader

Contoh:

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

— S.M_Emamian
sumber

1

Apakah ini salah ketik? Itu harus rulesdi webpack 4.

— Sin

Anda harus menggunakan aturan di webpack 4.

— S.M_Emamian

2

ubah loader ke aturan di webpack 4 ... kalau-kalau perlu dikatakan lagi: /

— Helmut Granda

1

Anda harus menjelaskan dalam jawaban Anda bahwa alasan perubahannya adalah webpack 4.

— kojow7

13

Gunakan rulesdi webpack 4 bukan loaders.

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

— Shawn Stephens
sumber

2

Di atas jawaban yang diberikan berfungsi tetapi kami dapat mengatasi masalah ini dengan mengubah versi webpack dan webpack-dev-server ke

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

Itu juga bisa menyelesaikan masalah. Semoga ini bisa membantu.

— Anshul
sumber

Saya memberi Anda uptick. Satu-satunya masalah adalah bahwa orang ingin meningkatkan versi kerangka kerja dan alat untuk mendapatkan fitur baru tidak kembali ke versi yang lebih lama hanya untuk memastikan mereka tidak perlu mengubah file konfigurasi mereka. Mungkin mengambil rasa sakit untuk mengubah file konfigurasi agar sejajar dengan cara baru alat ini bekerja tidak buruk. Kecuali itu tidak mungkin.

— Eniola

Terima kasih @Eniola, Ya kamu benar. Seperti yang saya sebutkan, jawaban S.M_Emamian benar tetapi jawaban saya akan berhasil jika seseorang setuju untuk bekerja akan menggunakan versi webpack yang lebih lama.

— Anshul

2

Anda harus menggunakan utilitas migrasi untuk memigrasikan file konfigurasi webpack Anda, itu berhasil untuk saya.

The dokumentasi migrasi juga berguna.

— MattG
sumber

0

Bekerja untuk saya di bawah 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' }
        ]
    }
}

— Pankaj Upadhyay
sumber