configuration.module ha una proprietà sconosciuta 'loaders'

136

il mio output di errore:

Oggetto di configurazione non valido. Webpack è stato inizializzato utilizzando un oggetto di configurazione che non corrisponde allo schema API. - configuration.module ha una proprietà sconosciuta 'loaders'. Queste proprietà sono valide: object {exprContextCritical ?, exprContextRecursive ?, exprContextRegExp ?, exprContextRequest ?, noParse ?, rules ?, defaultRules ?, unknownContextCritical ?, unknownContextRecursive ?, unknownConte? ?, strictExportPresence ?, strictThisContextOnImports? } -> Opzioni che influenzano i normali moduli ( NormalModuleFactory).

il mio 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;

la mia versione del webpack:

webpack@4.1.1

reactjs webpack

— S.M_Emamian
fonte

317

È necessario passare loadersa rulesin Webpack 4:

modificare:

loaders

per:

rules

fonte: Caricatori

Esempio:

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

— S.M_Emamian
fonte

1

È un errore di battitura? Dovrebbe essere rulesnel webpack 4.

— Sin

dovresti usare le regole nel webpack 4.

— S.M_Emamian

2

cambia i caricatori alle regole nel webpack 4 ... nel caso fosse necessario dirlo di nuovo: /

— Helmut Granda

1

Dovresti spiegare nella tua risposta che il motivo del cambiamento è il webpack 4.

— kojow7

13

Utilizzare rulesin Webpack 4 anziché loaders.

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

— Shawn Stephens
fonte

2

Le risposte sopra riportate funzionano ma possiamo risolvere questo problema modificando la versione di webpack e webpack-dev-server

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

Può anche risolvere il problema. Spero che possa essere d'aiuto.

— Anshul
fonte

Ti ho dato una spinta. L'unico problema è che le persone vogliono aggiornare versioni di framework e strumenti per ottenere nuove funzionalità e non tornare alle versioni precedenti solo per assicurarsi che non debbano modificare i propri file di configurazione. Forse non è un problema prendersi il disturbo di modificare il file di configurazione per allinearlo al nuovo modo in cui lo strumento funziona. A meno che ciò sia impossibile.

— Eniola,

Grazie @Eniola, sì hai ragione. Come ho già detto, la risposta S.M_Emamian è corretta, ma la mia risposta funzionerà se qualcuno accetta di lavorare con la versione precedente del webpack.

— Anshul

2

È necessario utilizzare l' utilità di migrazione di migrazione per migrare i file di configurazione del tuo webpack, ha funzionato per me.

Anche la documentazione sulla migrazione è utile.

— MattG
fonte

0

Lavorando per me sotto 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
fonte