Angular 13: SyntaxError Encountered: Token 'export' Not Recognized

After upgrading Angular from version 12 to 13, I encountered an error when running the app: "Uncaught SyntaxError: Unexpected token 'export'." Here are some additional details for context:

In the angular.json configuration file, I had specified the following entry in the scripts section:

"./node_modules/@angular/core/bundles/core.umd.js"

However, after updating to Angular 13, I noticed that instead of UMD JS files, we now have .mjs files located at:

"./node_modules/@angular/core/esm2020/core.mjs".

Note: The error originates from scripts.js and specifically points to the line "export * from './index';" (which is found in the core.mjs file).

If anyone has faced this issue before and knows a solution, please share.

I attempted adding "module" type in the main package.json file, but the problem persists.

Answer №1

Hello @deepak, it is recommended to use a supported Node.JS version such as 10, 12, or 14.

Note that Node.JS version 13 is no longer supported by the official team. If you are using a newer version like nodejs > 14, kindly provide us with your package.json details.

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

Is it necessary to use ReplaySubject after using location.back() in Angular 6 to avoid requesting data multiple times?

I'm currently utilizing a BehaviorSubject in my service to retrieve data from the BackEnd, which I subscribe to in my mainComponent using the async pipe. However, whenever I navigate to another subComponent and then return to my mainComponent by clic ...

Unraveling a discriminated union

I'm currently working on writing code that can handle generic discriminated unions with a type property. Imagine I have multiple discriminated unions defined as follows: interface IFoo { type: "foo"; foo: number; } interface IBar { type: "bar ...

Discovering React Styled Components Within the DOM

While working on a project using Styled Components in React, I have successfully created a component as shown below: export const Screen = styled.div({ display: "flex", }); When implementing this component in my render code, it looks like this ...

Using FormArray in Angular 2 with ControlValueAccessor

My child component manages an array of input controls and I would like to implement a form control over this child component. I am passing an array of JSON objects and I am wondering what is the correct way to bind the parent form to the child component&a ...

Uploading files using Remix.run: Transforming a File object into a string during the action

I'm currently developing a Remix application that allows users to upload files through a form. I have a handler function for handling the form submission, which takes all the form data, including file attachments, and sends it to my action. The probl ...

Place a hook following the storage of a variable in the device's memory

Within a component, I am facing the following situation: const [home, setHome]=useState(false) if(home){ return(<Redirect push={true} to="/" />); } setItem("isRegistered", resquest[0].user) setHome(true) The issue here is that ...

Is there a way to omit type arguments in TypeScript when they are not needed?

Here is a function I am currently working with: function progress<T>(data: JsonApiQueryData<T>): number { const { links, meta } = data.getMeta(); if (!links.next) { return 1; } const url = new URL(links.next); return parseInt(url ...

Angular checkboxes not updating with current values when submitted

I have defined a static array in TypeScript like this: permissions: any[] = [ { permission: "Read", enabled: true }, { permission: "Write", enabled: false }, { permission: "Delete", enabled: false }, { permission: "Edit", enabled: true } ...

Utilizing Angular: Importing Scripts in index.html and Implementing Them in Components

Currently, I am attempting to integrate the Spotify SDK into an Angular application. While I have successfully imported the script from the CDN in index.html, I am encountering difficulties in utilizing it at the component level. It seems like there may be ...

Determining when to include @types/packagename in React Native's dev dependencies for a specific package

Just getting started with React Native using typescript. Take the package vector icon for example, we need to include 2 dependencies: 1. "react-native-vector-icons": "^7.1.0" (as a dependency) 2. "@types/react-native-vector-icons": "^6.4.6" (as a dev ...

When trying to gather multiple parameters using @Param in a NestJS controller, the retrieved values turn out

Can someone help me understand why I am struggling to retrieve parameters using the @Param() decorators in my NestJS controller? These decorators are defined in both the @Controller() decorator argument and the @Get() argument. I am relatively new to Nest ...

Error encountered: Unable to locate module 'psl'

I'm encountering an issue when trying to execute a pre-existing project. The error message I keep receiving can be viewed in the following error logs image Whenever I attempt to run "npm i", this error arises and I would greatly appreciate it if some ...

Enhancing Code Functionality with TypeScript Overload Methods

I've encountered an issue with a code snippet that has a method with 2 overloads: /** * Returns all keys of object that have specific value: * @example * KeysOfType<{a:1, b:2, c:1}, 1> == 'a' | 'c' */ type KeysOfType<M ...

(iOS) Detecting input from keys with non-ascii characters captured

I am attempting to subscribe to physical keyboard events (excluding non-ASCII keys) in my app developed using the Ionic Framework (issue arises when trying to access a page launched by ionic serve, deploying the app on my iOS device, or running it in an iO ...

What changes can be implemented to convert this function to an asynchronous one?

Is it possible to convert the following function into an asynchronous function? getHandledSheet(): void { this.timesheetService.getAllTimesheets().subscribe({next: (response: TimeSheet[]) => {this.timesheetsHandled = response.filter(sheet => ...

Incorporate a progress bar into the Material-UI table design

I have the following example of a Material-UI table: import React from "react"; import clsx from "clsx"; import { createStyles, lighten, makeStyles, Theme } from "@material-ui/core/styles"; import Table from "@mat ...

Is there a similar function to $.ajax for React.js and Angular.js?

Can you guide me on how to send data using both React and Angular? Is there a similar function to $.ajax in React and Angular frameworks? I am looking for a post function that works like the one shown below in both React and Angular: $.ajax{ url:"test.p ...

Sortable layouts and tables in Ionic 3

I found a great example of an Ionic table that I'm using as reference: https://codepen.io/anon/pen/pjzKMZ <ion-content> <div class="row header"> <div class="col">Utility Company Name</div> <div c ...

Retail Shop versus Requesting Services While Out and About

Currently, I am in the process of implementing an API for Q&A on my portal and I am faced with two options: To hard code the categories into the HTML, and only load the questions from the API when the category component is opened (which will be displayed ...

Having trouble utilizing Vue3 methods while utilizing the `<script setup lang="ts">` syntax

Looking to incorporate Vue into a non-Vue Class using the Composition API for a Chrome Extension project where having the entire thing as a Vue App doesn't make sense. The Vue Instance is being instantiated in the usual manner and then injected into ...