React-dnd: Erreur Babel - Utilisation de l'option Babel 5 supprimée

Salut @jagan-veeraraghavan ! Comment incluez-vous react-dnd dans Bower ? Tu devrais faire comme ça .

Il semble que vous dirigez plutôt Bower vers l'intégralité du référentiel Github. Cela ne fonctionnera pas car il inclut .babelrc , un fichier de configuration Babel 5 incompatible avec la version de Babel que vous utilisez (6). La distribution npm omet ce fichier (d'ailleurs, nous suggérons d'utiliser npm sur Bower).

Si je me trompe, n'hésitez pas à rouvrir le sujet. Je recommanderais également la salle Gitter pour les questions d'assistance comme celle-ci.

Salut, j'ai rencontré un problème similaire, en utilisant webpack et babel 6.

ERROR in ./~/dnd-core/lib/index.js
Module build failed: ReferenceError: [BABEL] /node_modules/dnd-core/lib/index.js: 
Using removed Babel 5 option: /node_modules/dnd-core/.babelrc.stage - Check out the corresponding stage-x presets http://babeljs.io/docs/plugins/#presets

voici mes paramètres :

package.json

{
  "devDependencies": {
    "babel-core": "^6.3.26",
    "babel-loader": "^6.2.1",
    "babel-preset-es2015": "^6.3.13",
    "babel-preset-react": "^6.3.13",
    "babel-preset-stage-0": "^6.5.0",
    "css-loader": "^0.23.1",
    "extract-text-webpack-plugin": "^1.0.1",
    "file-loader": "^0.8.5",
    "jquery": "^2.2.1",
    "less": "^2.6.1",
    "less-loader": "^2.2.2",
    "style-loader": "^0.13.0",
    "url-loader": "^0.5.7",
    "webpack": "^1.12.9",
    "webpack-dev-server": "^1.14.0"
  },
  "dependencies": {
    "babel-polyfill": "^6.3.14",
    "expose-loader": "^0.7.1",
    "jquery": "^2.1.4",
    "lodash": "^3.10.1",
    "react": "^0.14.7",
    "react-dnd": "^2.1.3",
    "react-dnd-html5-backend": "^2.1.2",
    "react-dom": "^0.14.7",
    "tracking": "^1.1.2"
  }
}

.babelrc

{
  "presets": ["react", "es2015", "stage-0"]
}

Webpack

var webpack = require('webpack');
var ExtractTextPlugin = require("extract-text-webpack-plugin");

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

quelqu'un peut m'aider s'il vous plait ?

Ahhh, je l'ai corrigé en excluant node_modules dans webpack.conf :dancers:

      {
        exclude: /(node_modules|bower_components)/,
        test: /\.js$/,
        loader: 'babe-loader'
      },

ça résout mon problème, merci beaucoup !

@ walter0331

chargeur : 'babe-loader'

Cela devrait être une chose.

@billyjanitsch avez-vous envisagé de mettre à jour babel ? Seriez-vous ouvert aux relations publiques avec ?

Je rencontre ce problème avec Webpack et Babel 6. De la même manière que @ walter0331. Je dois continuer à parcourir ma Babel car nous effectuons une minification personnalisée de node_modules donc exclure node_modules ne m'aidera pas.

Juste pour clarifier, je pense que tout le monde veut dire "babel-loader" plutôt que "babe-loader".

loader: 'babel-loader'

J'essaie de passer de babel5.x à 6.x et j'obtiens la même erreur. J'utilise react, redux avec babel 6 et webpack.

Ci-dessous se trouve ma configuration webpack (partielle)
module : {
chargeurs : [
{ test : /.svg$/, exclure : /.less$/, chargeur : 'svg-inline'},
{ test : /.coffee$/, chargeur : 'coffee-loader' },
{ test : /.jsx?$/, exclure : /node_modules/,
chargeurs :
['react-hot-loader/webpack', 'babel-loader?' + JSON.stringify({
préréglages : ['es2015','stage-0','react'],
plugins : ['transform-decorators-legacy',
['transformer-async-en-module-méthode',
{'module': 'bluebird', 'method': 'coroutine'}
]]
})
]
},
{ test : /.less/, chargeur : 'style-loader!css-loader!less-loader' },
{ test : /.css/, chargeur : 'style-loader!css-loader' },
{ test : /.json$/, chargeur : 'json-loader' },
{ test : /.gif$/, chargeur : "url-loader?mimetype=image/png" },
{ test : /.woff(2)?(\?v=[0-9].[0-9].[0-9]) ?$/, chargeur : "url-loader?limit=10000&minetype=application/ font-woff" },
{ test : /.(ttf|eot|svg)(\?v=[0-9].[0-9].[0-9]) ?$/, chargeur : "file-loader" },
{ test : /jquery.js$/, chargeur : 'expose?jQuery' },
]
},

.babelrc

{
"presets": ["es2015", "react", "stage-0"],
"plugins": ["transform-decorators-legacy", ["transform-async-to-module-method", {
"module": "oiseau bleu",
"méthode": "coroutine"
}]]
}

J'ai remarqué une chose que ce message d'erreur apparaît principalement pour les fichiers où j'importe Promise à partir de « bluebird ».

Quelqu'un peut-il aider?

cogner. Existe-t-il un moyen d'ignorer les configurations babel des dépendances au moment de la construction... ?

@ walter0331 merci beaucoup, ce problème ne me rend pas si confus jusqu'à ce que je lis votre solution. Mais je ne comprends pas le principe pourquoi cela peut fonctionner en définissant comme ceci ：exclure: /(node_modules|bower_components).

@ry928330 fondamentalement, la disposables est utilisée dans react-dnd , et disposables utilise une version de babel obsolète, Babel 5 (cette bibliothèque n'est pas maintenue). S'il est inclus dans la configuration du webpack, cela crée un conflit car nous sommes maintenant sur la version 6 de Babel. Donc, la meilleure solution ici (du moins ce qui a fonctionné pour moi), n'est pas nécessairement d'exclure tous les node_modules, mais seulement celui en conflit.

ajoutez exclude: /(disposables)/ dans votre configuration webpack babel-loader, par exemple :

{
     test: /\.js$/,
     exclude: /(disposables)/,
     loader: 'babel-loader',
}

C'est la bonne solution. Peu importe quelle version de Babel disposables utilise sous le capot. Le vrai problème est que vous essayez de compiler node_modules avec Babel. Ce n'est pas toujours sûr et vous ne devriez pas le faire à moins de savoir ce que vous faites et d'opter uniquement pour des packages spécifiques (ou d'utiliser un autre signal tel que le champ engines et de ne pas tenir compte de la configuration).

Cela dit, j'ai publié un "correctif" dans [email protected] . Pourtant, si vous compilez tout dans node_modules vous posez des problèmes.

mix.webpackConfig({ module: { rules: [{ test: /\.jsx?$/, exclude: /(node_modules|bower_components)/, use: { loader: 'babel-loader', options: Config.babel() } }] } })

ça marche, merci !

J'ai corrigé en ajoutant []
presets: [ ["es2015", { loose: false }] ]

cela m'est arrivé après avoir ajouté par inadvertance stage: 1 à mon fichier server/.babelrc .

{
  "presets": ["es2015", "stage-0"],
  "plugins": ["transform-runtime"],
   stage: 1
}

corrigé en supprimant ce

{
  "presets": ["es2015", "stage-0"],
  "plugins": ["transform-runtime"],
}