CODEWITHSUNDEEP
reactjswebpackbabeljswebpack-dev-server
Erkan Demir
Erkan Demir

Reputation: 795

Webpack, React, Babel - Cannot Resolve module

I have installed react-hot-loader and referenced the module in the webpack.config.js. However when i try to run webpack to compile the scripts, i get an error.

Please see below screen shot. Could someone please advise of what the issue could be. FYI, i am using all the latest libraries.

 [1]: https://i.sstatic.net/2GCa1.jpg

    /*webpack.config.js
    module.exports = {
devtool: 'eval-source-map',
entry: {
    main: [
        './src/main.js'
    ]
},
output: {
    filename: './public/[name].js'
},
module: {
    loaders: [
        {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            loader: ['react-hot','babel-loader'],
            query: {
                presets: ['es2015', 'react']
            }
        }
    ]
}
}

/*UPDATE*/
Code update
I have added an "s" after loader. It is now giving me the below error.

[2]: https://i.sstatic.net/LL1nn.jpg

Upvotes: 1

Views: 9108

Answers (2)

Timon
Timon

Reputation: 2702

Based on your second picture, you could try the following:

loaders: [
        {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            loader: ['react-hot'],
        },
        {
            test: /\.jsx?$/,
            exclude: /node_modules/,
            loader: ['babel-loader'],
            query: {
                presets: ['es2015', 'react']
            }
        }
    ]

Upvotes: 6

Pawel
Pawel

Reputation: 1692

I've created a starter with webpack, babel and react-hot-loader. Please have a look into my config: https://github.com/skrobek/webpack-react/blob/master/webpack.config.js

and package.json https://github.com/skrobek/webpack-react/blob/master/package.json#L19

Feel free to use it :-)

Upvotes: 1

Related Questions