Using webpack with babel and babel-preset-react and babel-preset-es2015

Question

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.

vially vially · Accepted Answer · 2015-11-03T20:49:42

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.

Using webpack with babel and babel-preset-react and babel-preset-es2015

4 Answers