Error: Cannot resolve module 'babel-loader'

Question

I'm trying to run webpack on my postinstall script in my package.json when I push to heroku but I am getting the following error.

ERROR in Entry module not found: Error: Cannot resolve module 'babel-loader' in /tmp/build_6cb4b10367d9382367ab72f2e2f33118

When I run the command locally I get no issues. Below is my webpack config - i have tried using resolveLoader to fix the resolving issue but to no avail?

var path = require('path');
var webpack = require('webpack');

var config = {
  entry: path.resolve(__dirname, './app/main.js'),
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
      },
      {
        test: /\.less$/,
        loader: 'style!css!less'
      }]
  },
  resolve: {
    extensions: ['', '.js', '.jsx', '.less'],
    modulesDirectories: [
      'node_modules'
    ]
  },
  resolveLoader: {
    root: path.resolve(__dirname, 'node_modules')
  },
  plugins: [
    new webpack.optimize.UglifyJsPlugin({minimize: true})
  ]
};

module.exports = config;

Any suggestions? Thanks

Answer 1

I found out why. I didn't have babel or babel-core in my package.json. Add them fixed the error.

  "devDependencies": {
    "babel": "^5.8.23",
    "babel-core": "^5.0.0",
    "babel-loader": "^5.3.2"
}

Answer 2

In my case, I had mis-spelled the loader while installing it, so make sure you install

babel-loader

NOT

bable-loader

Answer 3

In my case, I tried the command:

$ npm install babel-loader --save

and continued to fix the rest based on the reminder from the console, and it fixed the issue:

"ERROR in Entry module not found: Error: Can't resolve 'babel-loader'"

Answer 4

I had a similar error when working on a Rails 6 application.

I think the issue was that the Babel-loader node package wasn't installed properly or the executable couldn't be located by the application.

All I had to do was to upgrade the node packages in the application by running:

yarn upgrade

Here's my devDependencies in my package.json file:

"devDependencies": {
    "webpack": "^4.43.0",
    "webpack-cli": "^3.3.12",
    "webpack-dev-server": "^3.11.0

Note : I didn't have to include Babel-loader node package in the list of devDependencies for it to work.

Answer 5

I'm using yarn and webpacker for a rails + react project.

I know not everyone can upgrade all their dependencies without breaking things, but for me, adding running yarn upgrade fixed this error.

That was with only @babel/core in my dependencies config, since babel-loader is included as a dependency of webpacker.

Answer 6

In some cases, when deploying to production (for example with Rails Webpacker), dev dependencies are not loaded. So having babel-loader in devDependencies will not work.

In fact, it makes sense that babel-loader would be placed in dependencies , not devDependencies , because it's used in the production code itself. The only packages that should be in devDependencies are those that are run in development, such as tests and linters.

Answer 7

I had mine in devDependencies and it didn't work, I switched it to dependencies and it finally worked!

Answer 8

I deleted the yarn.lock and node_modules folder then omit babel-loader in your devDependencies in package.json, then i rerun yarn, and it works.

Answer 9

When using yarn 2, webpack 4 is unable to resolve the loader. or update to webpack 5

I had to use PnPify to make it work.

yarn pnpify webpack

Answer 10

In my case react-scripts was importing babel-loader as dependency. It worked for a while because it was in package-lock.json. If you have react-scripts in your deps, try removing node_modules, package-lock.json and do npm install again.