An issue with the Babel version is preventing the Express API from starting up successfully

Error! Message:

[nodemon] starting `babel-node index.js`
C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:328
        throw e;
        ^

Oops! Babel version mismatch - Requires Babel "^7.0.0-0", but loaded with "6.26.3". Check if your @babel/core version is compatible. Make sure nothing in your build process is loading the wrong version. Review stack trace for details on what's calling Babel incorrectly. (Processing preset: "C:\\Users\\Zara Gunner\\FYP\\fourthyearproject\\fourthyearproject\\node_modules\\@babel\\preset-env\\lib\\index.js")
    at throwVersionError (C:\Users\Zara Gunner\FYP\fourthyearproject\fourthyearproject\node_modules\@babel\helper-plugin-utils\lib\index.js:78:11)    
    at Object.assertVersion (C:\Users\Zara Gunner\FYP\fourthyearproject\fourthyearproject\node_modules\@babel\helper-plugin-utils\lib\index.js:28:5)
    at C:\Users\Zara Gunner\FYP\fourthyearproject\fourthyearproject\node_modules\@babel\preset-env\lib\index.js:251:7
    at C:\Users\Zara Gunner\FYP\fourthyearproject\fourthyearproject\node_modules\@babel\helper-plugin-utils\lib\index.js:22:12
    at C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:317:46
    at Array.map (<anonymous>)
    at OptionManager.resolvePresets (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:275:20)
    at OptionManager.mergePresets (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:264:10)
    at OptionManager.mergeOptions (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:249:14)
    at OptionManager.init (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-core\lib\transformation\file\options\option-manager.js:368:12)
    at compile (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-register\lib\node.js:103:45)
    at loader (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-register\lib\node.js:144:14)
    at Object.require.extensions.<computed> [as .js] (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\node_modules\babel-register\lib\node.js:154:7)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at Object.<anonymous> (C:\Users\Zara Gunner\AppData\Roaming\npm\node_modules\babel-cli\lib\_babel-node.js:154:22)
    at Module._compile (node:internal/modules/cjs/loader:1103:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1155:10)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12)
    at node:internal/main/run_main_module:17:47 {
  code: 'BABEL_VERSION_UNSUPPORTED',
  version: '6.26.3',
  range: '^7.0.0-0'
}

Answer №1

I encountered the same issue, and here is what I did:

Firstly, check your global package list by running the following command:

> npm list -g --depth 0

Also, review your project's package.json file and remove any reference to the babel- library. Instead, install the @babel/ library.

Make sure you have globally installed both babel-cli and @babel/node packages.

  1. Start by uninstalling older global packages:
> npm uninstall @bable/node babel-cli -g
  1. Delete the package-lock.json and node_modules folder from your project root.
  2. Install the latest versions of @bable/cli and @babel/node globally using npm (Note: use @babel/cli instead of babel-cli)
> npm install @babel/node @babel/core -g
  1. In your project root directory, uninstall any old versions of @babel/ and replace with the newest version. (Assuming the libraries are in the devDependencies section)

> npm uninstall babel-cli babel-node -D
> npm install @bable/node babel-cli -D

That should solve the issue.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Encountering 404 or 502 errors when running multiple vue.js containers in a Kubernetes and Terraform environment

I'm currently facing an issue with my setup involving Ingress, Terraform, NGINX, and Kubernetes. It's serving a vue.js frontend and a .NET Core backend successfully online. However, when I try to add another Vue.JS instance, it fails to redirect ...

Organize your blog content by utilizing post IDs as the designated id attribute

What is the best way to format blog posts and comments in HTML so that I can easily manipulate them later using jQuery/Javascript for tasks like updating, deleting, or making Ajax calls? I am considering using the IDs (primary keys in the database) of the ...

Searching with multiple parameters in MongoDB

In my database schema, I have defined various fields such as creatorId, roommatePreference, roomInfo, location, pricing, availability, amneties, rules, photos, description, and status. Each field serves a specific purpose in listing a room for rent. The c ...

Tips to prevent encountering the "The response was not received before the message port closed" error while utilizing the await function in the listener

I'm currently in the process of developing a chrome extension using the node module "chrome-extension-async" and have encountered an issue with utilizing await within the background listener. In my setup, the content.js file sends a message to the ba ...

Error encountered: `TypeError: Unable to access undefined properties (specifically, '0') within the Simple React Project`

Currently in the process of learning React and working on a simple photo application. Encountering an issue: Collection.jsx:6 Uncaught TypeError: Cannot read properties of undefined (reading '0') Why is this happening? Everything was functioni ...

The function error is currently in a waiting state as it already includes an

I encountered a particular issue that states: "await is only valid in async function." Here is the code snippet where the error occurs: async function solve(){ var requestUrl = "url"; $.ajax({url: "requestUrl", succes ...

In Javascript, we can increment the current date by utilizing the `getDate()`

I am trying to create an if statement in JavaScript; if (nextProcessingDate > today ) { //do something } nextProcessingDate has a timestamp assigned, like 09/07/2014 12:10:17 To assign today's timestamp to the today variable, I am using this c ...

What is the best way in jQuery to show each element of an array one at a time with a space in an input field?

I have a large array filled with strings that I want to display one by one in a text field, automatically concatenated with a space bar. Below is my code: <script> x = 0; function abc() { for (i = 0; i < words[x].length; i++) { ...

Choose the specific Element by its dynamicID in JQuery

Just starting out with Jquery and I have a specific task in mind. In my HTML page, I have elements with IDs generated by concatenating a string variable. My goal is to use JQuery to select the element with this dynamically generated ID. See below for more ...

The optimal method for computing the Fibonacci sequence using JavaScript

Improving my skills in optimizing algorithms and understanding big-o notation is a priority for me. I devised the following function to compute the n-th Fibonacci number. It works well for higher inputs, but I wonder how I can enhance it. What are the dow ...

Server connection failure: MongoDB is unable to establish a connection

UPDATE: After attempting different ports, terminating tasks on ports, and trying again, I am still unable to connect. Today, I embarked on a tutorial for the MERN stack but unfortunately, I am unable to establish a connection to the server. Upon using npm ...

Securing routes within APIs and clients using next-auth: A comprehensive guide

Managing both the backend and frontend with Express, I have the backend running on port 8080 and the frontend on port 80. /api/route1 responds with a success code 200 and JSON data /api/route2 responds with a success code 200 and JSON data T ...

How to update a value within a deeply nested array in MongoDB and then sort the data

In my document, I have a list of timestamps that are sorted by time: { _id: '1', timestamps: [ { id: '589b32cf-28b3-4a25-8fd1-5e4f86682199', time: '2022-04-13T19:00:00.122Z' }, { id: '781 ...

Incorrect sequencing in Chart.js chart with time displayed on the horizontal axis

Hey there, I'm currently working on displaying some data using chart.js in angularjs. However, I seem to be facing an issue with the ordering of my data which is resulting in a strange looking chart like this: https://i.stack.imgur.com/F6phH.png Her ...

Is there a way to attach a model to an Angular directive?

Currently, I am implementing angular's typeahead functionality using the following resource: I have created a directive with the following template: <div> <input type="text" ng-model="user.selected" placeholder="Ty ...

Tips for creating $http calls in AngularJS

Having some issues with my code, as I'm unsure of the correct placement for making an $http request to a local server. api.js var express = require('express'); var router = express.Router(); var mongoose = require('mongoose'); va ...

Angular Bootstrap UI - Ensuring only one element collapses at a time

I have integrated the angular bootstrap UI library into my website by following this link: https://angular-ui.github.io/bootstrap/ One issue I am facing is that when I implement a collapsible feature using this library, it collapses or expands every eleme ...

Setting headers in Node using express-http-proxy before proxying data is an effective way to customize

When attempting to proxy to a specific address, I need to set the header of the proxy beforehand. It's like an interceptor for me. Currently, I am using the express-http-library and express with Node.JS. However, my code so far doesn't seem to be ...

A guide on showcasing real-time data with Angular's service feature

home.component.ts <h1>{{ (reportsToday$ | async)}}</h1> <div echarts [options]="alertsDaily$ | async"> <div echarts [options]="alertsToday$ | async"> <div [onDisplay]="alertsDaily$ | async"> report.component.ts constructor( ...

Nuxt is encountering an issue where it's unable to read properties of null, specifically when trying to access the $

When it comes to creating conditional event handlers, I've been approaching it like this: <section>@mouseover="this.$route.path === '/' && imgHoverIn"</section> Unfortunately, this approach is resulting in an e ...