Vous pouvez avoir besoin d'un chargeur approprié pour gérer cette erreur de type de fichier.

Question

J'ai le code suivant (es6 spread Attribute) :

 return {...state, name: action.payload};

L'erreur affichée est la suivante : Vous pouvez avoir besoin d'un chargeur approprié pour traiter ce type de fichier.

paquet.json

Que dois-je installer d'autre pour que cela fonctionne ? Tous les autres ES6 fonctionnent mais pas l'attribut spread.

webpack.config.js

Answer 1

Vous devez avoir configuré babel-loader pour les fichiers js à transpiler.

extrait de configuration de webpack :

{
    test: /\.js$/,
    exclude: /node_modules/,
    use: [
      'babel-loader'
    ]
  }

Règles du module intérieur.

Ajoutez également .babelrc dans le répertoire d'origine de vos projets avec le contenu suivant

{
   "presets" : [
     "latest"
   ]
}

Answer 2

Pour utiliser ecmascript-6 vous devez (1) ajouter .babelrc avec les présélections suivantes

{
  "presets": [ "es2015" ]
}

es2015 est celui dont vous avez besoin.

Et ensuite (2) configurer votre webpack pour inclure

module.exports = {
  ...,
  loaders : [
    { test: /\.js$/, exclude: /(node_modules)/, loader: 'babel-loader' }
  ]
}

Answer 3

Installer les chargeurs via npm n'est pas suffisant. Vous devez configurer ces chargeurs dans votre webpack.

Ajoutez ce qui suit dans votre webpack.config.js

loaders: [
    {
      test: /\.js$/,
      exclude: /(node_modules|bower_components)/,
      loader: 'babel-loader',
      query: {
        presets: ['es2015']
      }
    }
  ]

Utilisation de chargeurs dans webpack

Le code ci-dessus signifie que, chaque fois qu'il trouvera un fichier qui correspond à \.js$ (fichiers qui se terminent par .js), babel-loader sera utilisé. (Vous avez déjà installé babel-loader dans vos dépendances.

Vous pouvez également utiliser loader: 'babel' au lieu de `loader : 'babel-loader'. C'est la même chose.