Sou um novato no babel, configurei um novo projeto, instalei o babel, instalei o react-dnd via bower e meu .babelrc tem a seguinte linha
{
"presets": ["es2015", "stage-0", "react"]
}
Falha na construção do módulo: ReferenceError:
[BABEL] <path>\bower_components\react-dnd\src\index.js: Using removed Babel 5 option: <path>\bower_components\react-dnd\.babelrc.stage - Check out the corresponding stage-x presets http://babeljs.io/docs/plugins/#presets
O que estou fazendo de errado
Olá @ jagan-veeraraghavan! Como você está incluindo o react-dnd no Bower? Você deve estar fazendo isso como esta .
Parece que, em vez disso, você está apontando o Bower para todo o repositório Github. Isso não funcionará porque inclui .babelrc
, um arquivo de configuração do Babel 5 incompatível com a versão do Babel que você está usando (6). A distribuição npm omite este arquivo (aliás, sugerimos usar npm no Bower).
Se eu estiver errado, fique à vontade para reabrir o problema. Eu também recomendo a sala do
HI, tive um problema semelhante, usando webpack e 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
aqui estão minhas configurações:
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'
}
]
}
};
Alguém pode me ajudar por favor?
Ahhh, eu consertei excluindo node_modules
em webpack.conf: dancers:
{
exclude: /(node_modules|bower_components)/,
test: /\.js$/,
loader: 'babe-loader'
},
resolve meu problema, muito obrigado!
@ walter0331
loader: 'babe-loader'
Isso deve ser uma coisa.
@billyjanitsch , você considerou atualizar o babel? Você estaria aberto para relações públicas com ele?
Estou tendo esse problema com o Webpack e o Babel 6. Da mesma forma que @ walter0331. Preciso manter isso funcionando em meu Babel, pois estamos fazendo a minificação personalizada de node_modules
portanto, excluir node_modules
não vai me ajudar.
Só para esclarecer, acho que todo mundo quer dizer "babel-loader" ao invés de "babe-loader".
loader: 'babel-loader'
Estou tentando atualizar do babel5.x para 6.x e obtendo o mesmo erro. Estou usando o react, redux com babel 6 e webpack.
Abaixo está minha configuração do webpack (parcial)
módulo: {
carregadores: [
{teste: /.svg$/, exclui: /.less$/, carregador: 'svg-inline'},
{test: /.coffee$/, loader: 'coffee-loader'},
{teste: /.jsx?$/, exclui: / node_modules /,
carregadores:
['react-hot-loader / webpack', 'babel-loader?' + JSON.stringify ({
predefinições: ['es2015', 'stage-0', 'react'],
plug-ins: ['transform-decorators-legacy',
['transform-async-to-module-method',
{'módulo': 'pássaro azul', 'método': 'co-rotina'}
]]
})
]
},
{test: /.less/, loader: 'style-loader! css-loader! less-loader'},
{test: /.css/, loader: 'style-loader! css-loader'},
{test: /.json$/, loader: 'json-loader'},
{test: /.gif$/, loader: "url-loader? mimetype = image / png"},
{test: /.woff(2)?(\?v=[0-9].[0-9].[0-9])?$/, loader: "url-loader? limit = 10000 & minetype = application / font-woff "},
{test: /.(ttf|eot|svg)(\?v=[0-9].[0-9].[0-9])?$/, loader: "file-loader"},
{test: /jquery.js$/, loader: 'expose? jQuery'},
]
},
.babelrc
{
"presets": ["es2015", "react", "stage-0"],
"plugins": ["transform-decorators-legacy", ["transform-async-to-module-method", {
"módulo": "pássaro azul",
"método": "co-rotina"
}]]
}
Notei uma coisa que essa mensagem de erro aparece principalmente para os arquivos onde estou importando o Promise do 'bluebird'.
Alguém pode ajudar?
ressalto. Existe alguma maneira de ignorar as configurações de babel de dependências em tempo de construção ...?
@ walter0331 muito obrigado, esse problema não me deixou tão confuso até que li sua solução. Mas eu não entendo o princípio de porque isso pode funcionar definindo assim: exclude: / (node_modules | bower_components).
@ ry928330 basicamente, o disposables
lib é usado em react-dnd
, e disposables
usa uma versão desatualizada do Babel, Babel 5 (esta biblioteca não é mantida). Se incluído na configuração do webpack, isso cria um conflito porque agora estamos na versão 6 do Babel. Portanto, a melhor solução aqui (pelo menos o que funcionou para mim), não é necessariamente excluir todos os node_modules, mas apenas o conflitante.
adicione exclude: /(disposables)/
na configuração do webpack do seu babel-loader, por exemplo:
{
test: /\.js$/,
exclude: /(disposables)/,
loader: 'babel-loader',
}
Essa é a solução certa. É irrelevante qual versão do Babel disposables
usa nos bastidores. O verdadeiro problema é que você está tentando compilar node_modules
com o Babel. Isso nem sempre é seguro e você não deve fazer isso a menos que saiba o que está fazendo e apenas aceite pacotes específicos (ou use outro sinal, como o campo engines
e desconsidere a configuração).
Dito isso, publiquei uma "correção" em [email protected]
. Ainda assim, se você compilar tudo em node_modules
você está pedindo problemas.
mix.webpackConfig({
module: {
rules: [{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: Config.babel()
}
}]
}
})
está funcionando, obrigado!
Eu consertei por add []
presets: [ ["es2015", { loose: false }] ]
isso aconteceu comigo depois que eu inadvertidamente adicionei stage: 1
ao meu arquivo server/.babelrc
.
{
"presets": ["es2015", "stage-0"],
"plugins": ["transform-runtime"],
stage: 1
}
corrigido removendo este
{
"presets": ["es2015", "stage-0"],
"plugins": ["transform-runtime"],
}
Comentários muito úteis
@ walter0331
Isso deve ser uma coisa.