Cannot find module babel-preset-es2015

Question

Getting same error again again: Error: Cannot find module 'babel-preset-es2015'.

Full error log:

ERROR in ./main.js Module build failed (from ./node_modules/babel-loader/lib/index.js): Error: Cannot find module 'babel-preset-es2015' from 'C:\Users\hp\Desktop\reactApp'
 at Function.module.exports [as sync] (C:\Users\hp\Desktop\reactApp\node_modules\resolve\lib\sync.js:43:15)
 at resolveStandardizedName (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\files\plugins.js:101:31)
 at resolvePreset (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\files\plugins.js:58:10)
 at loadPreset (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\files\plugins.js:77:20)
 at createDescriptor (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\config-descriptors.js:154:9)
 at items.map (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\config-descriptors.js:109:50)
 at Array.map ()
 at createDescriptors (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\config-descriptors.js:109:29)
 at createPresetDescriptors (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\config-descriptors.js:101:10)
 at passPerPreset (C:\Users\hp\Desktop\reactApp\node_modules\@babel\core\lib\config\config-descriptors.js:58:96) @ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./main.js main[2]

Jenny

Answer 1

For Babel version 6 the package name is babel-preset-es2015 and for Babel version 7 the package name is @babel/preset-es2015.

From the error it seems that you're using version 7. The es20XX-presets are deprecated, so I recommend you switch to @babel/preset-env.

First install the preset (using npm):

npm install --save-dev @babel/preset-env

Then add the preset to your .babelrc

{
    "presets": ["@babel/preset-env"]
}

Fungous

I am getting Unexpected token { error while using preset-env – Capitulum

@Do NHu Vy [link]#65690920 i'm getting quite same error. Can you help me. – Goosestep

About 2 years I don't program NodeJS, JavaScript, I don't know. – Woodworker

Answer 2

Thing in that the babel 7 uses @babel/preset-env. Other presets are deprecated Here saying about this https://babeljs.io/docs/en/v7-migration#yearly-preset-deprecations-blog-2017-12-27-nearing-the-70-releasehtml-deprecated-yearly-presets-eg-babel-preset-es20xx

You should specify in a configuration file (I don't know if you are using Webpack or something else) preset as "@babel/preset-env". Install it through npm install --save-dev @babel/preset-env

For example, you are using Webpack module bundler. In that case, specify like this:

use: {
      loader: "babel-loader",
      options: {
                presets: ["@babel/preset-env"]
      }
}

Here is a documentation https://webpack.js.org/loaders/babel-loader/ if you suddenly will need.

Happy coding!

Metalepsis

Answer 3

I already had "@babel/preset-env" in my config. When I ran webpack, for some reason I was getting:

Module build failed (from ../../node_modules/babel-loader/lib/index.js):
Error: Cannot find package 'babel-preset-es2015' imported from /home/user/dev/package/babel-virtual-resolve-base.js

I added some debug to babel and found out that the problem was coming from /node_modules/babel-preset-es2016

The only packge using babel-preset-es2016 was ts-loader, which had v6 versions of babel stuff. My project was using babel 7.

  "devDependencies": {
    "babel-core": "^6.0.0",
    "babel-loader": "^7.0.0",
    "babel-polyfill": "^6.16.0",
    "babel-preset-es2015": "^6.0.0",
    "babel-preset-es2016": "^6.16.0",
    "babel-preset-react": "^6.0.0",

ts-loader was being imported by tsconfig-paths-webpack-plugin and I was using ts-loader in my webpack config:

                {
                    //exclude: /(node_modules)/,
                    test: /\.(ts|tsx)$/,
                    resolve: {
                        fullySpecified: false,
                    },
                    use: [
                        {
                            loader: require.resolve('ts-loader'),
                            options: {
                                configFile: 'tsconfig.json',
                                transpileOnly: true,
                            },
                        },
                    ],
                },

Removing ts-loader caused this config to break.

However, ts-loader is no longer needed as of babel 7. I discovered this here. I switched to using "@babel/preset-typescript" as per the linked answer and all is well.

Hypha