La configuration de Webpack a une propriété inconnue 'preLoaders'

Question

Je suis en train d'apprendre webpack à partir de zéro. J'ai appris comment faire un lien javascript fichiers avec l'exigent. Je suis le groupage et la minifying mes fichiers js et je suis à l'écoute pour les changements avec la montre. Je suis la mise en place des chargeurs pour convertir mes fichiers sass en css. Mais lorsque j'essaie de configurer un peluchage processus avec jshint-loader, je suis en cours d'exécution dans des questions.

    module: {
preLoaders: [
        {
            test: /\.js$/, // include .js files
            exclude: /node_modules/, // exclude any and all files in the node_modules folder
            loader: "jshint-loader"
        }
],

loaders: [
  {
    test: /\.scss$/,
    loader: 'style-loader!css-loader!sass-loader'
  },
  {
    test: /\.js$/,
    loader: 'babel-loader',
    exclude: /node_modules$/,
    query: {
      presets: ['es2015']
    }
  }
],

}

Voici l'erreur

Configuration non valide de l'objet. Webpack a été initialisée en utilisant un objet de configuration qui ne correspond pas à l'API de schéma. - configuration.module a une propriété inconnue 'précharge'. Ces propriétés sont valides: objet { exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, les chargeurs?, noParse?, règles?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? } Options affectant la normale modules (NormalModuleFactory).

Answer 1

Vous essayez apparemment d'utiliser des exemples pour webpack v1 avec webpack v2. Directement depuis le changelog :

   module: {
-   preLoaders: [
+   rules: [
      {
        test: /\.js$/,
+       enforce: "pre",
        loader: "eslint-loader"
      }
    ]
  }
 

Answer 2

Depuis la v2.1-beta.23, la section des chargeurs est renommée en règles et les pré / postLoaders sont désormais définis sous chaque règle avec la propriété enforce.

Donc renommez simplement preLoaders en rules et vous devriez être prêt à partir ;-)

Answer 3

Désinstaller d'abord le webpack

npm uninstall webpack --save-dev

suivi par

npm install webpack@2.1.0-beta.22 --save-dev

Answer 4

si vous utilisez webpack 2, vous pouvez utiliser la balise enforce: 'pre' à l'intérieur du tableau des chargeurs et cela fonctionnera comme une précharge, veuillez vous référer au code ci-dessous pour plus de détails

 module: {
    loaders: [
        {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'jshint-loader',
            //this is similar to defining a preloader
            enforce: 'pre'
        },
        {
            test: /\.es6$/,
            exclude: /node_modules/,
            loader: "babel-loader"
        }
    ]

},
 

Answer 5

utilisez celui-ci à la place ./webpack.config.js

  var path = require('path');

module.exports = {
   entry: './main.ts',
   resolve: {
     extensions: ['.webpack.js', '.web.js', '.ts', '.js']
   },
   module: {
     rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      }
    ]
   },
   output: {
     filename: 'bundle.js',
     path: path.resolve(__dirname, 'dist')
   }
 }
 

la documentation peut être trouvée ici le problème est lié à la version de ts-loader que vous avez installée