I'm trying to transcompile my react/es6 code and am coming from browserify. I'm struggling to create a webpack build because of the new babel 6 release and the fact that most of the tutorials out there are now outdated. This works in my .babelrc:
{
"presets": ["react"]
}
But when I change it to this:
{
"presets": ["es2015", "react"]
}
it throws this cryptic error:
ERROR in ./client/App.js
Module build failed: Error: You gave us a visitor for the node type "NumericLiteral" but it's not a valid type
This is my webpack.config.js if that helps at all:
module.exports = {
entry: "./client/App.js",
output: {
filename: "public/bundle.js"
},
resolve: {
extensions: ['', '.js', '.jsx']
},
module: {
loaders: [
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel'
}
]
}
};
Is there something obvious I'm missing? I've also swapped the order of the presets and it doesn't seem to make a difference. I have babel-core, babel-loader, babel-preset-es2015, babel-preset-react and webpack in my node modules.
In Babel, a preset is a set of plugins used to support particular language features. The two presets Babel uses by default: es2015 : Adds support for ES2015 (or ES6) JavaScript. react : Adds support for JSX.
@babel/preset-env is a smart preset that allows you to use the latest JavaScript without needing to micromanage which syntax transforms (and optionally, browser polyfills) are needed by your target environment(s). This both makes your life easier and JavaScript bundles smaller!
Webpack is a modular build tool that has two sets of functionality — Loaders and Plugins. Loaders transform the source code of a module. For example, style-loader adds CSS to DOM using style tags. sass-loader compiles SASS files to CSS. babel-loader transpiles JS code given the presets.
I've had the same issue and it seems to have gone away after I removed the node_modules directory and reinstalled all the dependencies.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With