CODEWITHSUNDEEP
javascriptreactjswebpack
Tanveer
Tanveer

Reputation: 97

"ERROR in loader Users/abc/node_modules/babel-core/index.js?{"presets":["react"]} didn't return a function "

When I'm doing webpack I'm getting into this error:

ERROR in loader Users/abc/node_modules/babel-core/index.js?{"presets":["react"]} didn't return a function

webpack.config.js

module.exports = {
  entry: './src/main.js',
  output: {
    filename: 'bundle.js',
    path: __dirname + '/dist'
  },
  module: {`enter code here`
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /(node_modules|bower_components)/,
        loader: 'babel-core',
        query: {
               presets: ['react']
            }
      }
    ]
  }
};

index.html

<html>
    <head>
        <title>React JSX (Precompiled) demo</title>
    </head>
    <body>
        <div id="mycontainer"></div>
        <script src="./dist/bundle.js"></script>
    </body>
</html>

main.js

var React = require('react');
var ReactDOM = require('react-dom');

var ReactComponent = React.createClass({
  render : function(){
  return(  <div>
    <h1>Welcome to React Js! </h1>
    </div>
  );
  }
});

ReactDOM.render(<ReactComponent/>,document.getElementById('mycontainer'));

package structure :

app 
  |
  |-src
   |
   |-main.js
  |-index.html
  |-webpack-config.js

Upvotes: 2

Views: 710

Answers (2)

Samuel Osborn Hackman
Samuel Osborn Hackman

Reputation: 1

in your webpack.config.js file make the loader be loader:babel-loader and it would work. no need to uninstall

module:{
    loaders:[
        {
            test: /\.jsx?$/,
            loader: 'babel-loader',
            exclude: /node_modules/
        }
    ]
}

Upvotes: 0

Richard Casetta
Richard Casetta

Reputation: 446

babel-core is the core of babel, it's not a loader. You should use :

loader: 'babel-loader' // Or just 'babel'

See example here

Don't forget to install babel-loader using npm.

Hope this helps

Upvotes: 4

Related Questions