Angular error: The object prototype can only be an Object or null, not undefined

Question

Angular error: The object prototype can only be an Object or null, not undefined

My project was functional until I decided to install ExcelJs (npm install --save exceljs) and things took a turn for the worse.

I started encountering errors such as

Cannot read property ‘Minus’ of undefined

and

Cannot find module 'postcss-value-something'

. Resolving these errors by installing missing parts using npm i , led me to yet another error -

TypeError: Object prototype may only be an Object or null: undefined

.

In an attempt to restore order, I removed ExcelJs from my project but unfortunately, the issues persisted.

The detailed error message is as follows:

    at setPrototypeOf (<anonymous>)
    at Object.__extends (F:\Honeycomb\Honey\Varroa\node_modules\@angular\compiler-cli\node_modules\tslib\tslib.js:68:9)
    ...

The contents of my package.json reveal various dependencies that might be causing conflicts within the project.

 "dependencies": {
   // List of dependencies
  },
  "devDependencies": {
    // List of devDependencies
  }

All signs point towards the cli/compiler cli version or even typescript being the culprits. However, finding specific information on the compatibility between versions has been challenging.

If you have any insights or guidance on resolving these issues, it would be greatly appreciated.

angular typescript exception npm

Answer 1

Answer №1

Wow, it looks like your Angular package versions are completely out of whack! How did your compiler-cli end up at 10.0.2 while your HTTP is only at 7.2.16? That's quite the mismatch! The best way to bring everything back in line is by using ng update @angular/cli, ng update @angular/core, and ng update @angular/material.

By following these steps, you can upgrade all your Angular packages to version 10 and hopefully handle any necessary migrations smoothly. It's crucial for all packages starting with @angular to have the same major version. Mixing versions like v7, v8, and v10 will only lead to confusion.

If updating through the CLI doesn't work, you might want to consider the following alternative steps:

Back up your source code located under src, as well as any other files you may want to save such as package.json to check for non-Angular packages dependencies.
Delete the entire project folder.
Upgrade your global @angular/cli by running
```
npm install -g @angular/cli@latest
```
.
Create a new project using ng new xxx.
Transfer your src files to the newly created project, excluding main.ts, polyfills.ts, and the tsconfig files due to significant changes in the latest Angular CLI version.
(Optional) Update any custom changes made in the non-copied files like package.json.

Going forward, always utilize ng update to keep all your Angular modules up to date, ensuring necessary code migrations are handled properly.

Just a quick note, using the ^ symbol will update the minor version of your installed package when doing npm update. For more information, check out this link here.

Answer 2

Wow, it looks like your Angular package versions are completely out of whack! How did your compiler-cli end up at 10.0.2 while your HTTP is only at 7.2.16? That's quite the mismatch! The best way to bring everything back in line is by using ng update @angular/cli, ng update @angular/core, and ng update @angular/material.

By following these steps, you can upgrade all your Angular packages to version 10 and hopefully handle any necessary migrations smoothly. It's crucial for all packages starting with @angular to have the same major version. Mixing versions like v7, v8, and v10 will only lead to confusion.

If updating through the CLI doesn't work, you might want to consider the following alternative steps:

Back up your source code located under src, as well as any other files you may want to save such as package.json to check for non-Angular packages dependencies.
Delete the entire project folder.
Upgrade your global @angular/cli by running
```
npm install -g @angular/cli@latest
```
.
Create a new project using ng new xxx.
Transfer your src files to the newly created project, excluding main.ts, polyfills.ts, and the tsconfig files due to significant changes in the latest Angular CLI version.
(Optional) Update any custom changes made in the non-copied files like package.json.

Going forward, always utilize ng update to keep all your Angular modules up to date, ensuring necessary code migrations are handled properly.

Just a quick note, using the ^ symbol will update the minor version of your installed package when doing npm update. For more information, check out this link here.

Angular error: The object prototype can only be an Object or null, not undefined

Answer №1

Similar questions

Is it possible to choose the inverse of a user-defined type in Angular?

Obtaining child component references in Angular using @ViewChildren

What is the best way to manage various Firebase Cloud Function API endpoints for different environments, such as DEV and PROD?

What is the best way to overload a function based on the shape of the argument object in

The Glyphicon is failing to display on the template

Is there a way to turn off NPM package restore in Visual Studio 2015?

Crafting a personalized arrow for sorting headers in Angular Material

Using Typescript for-loop to extract information from a JSON array

react.js function that returns 'undefined'

How to Customize Bootstrap Colors Globally in Angular 4 Using Code

What is the significance of the underscore prefix in package.json properties?

Issues with Angular2 http.get() returning 404 errors consistently

What could be the reason for the failure of the docker-compose volume binding while building? Is it obligatory to always COPY the essential build files?

Integrating Vimeo videos into Angular applications

Ways to manage an rxjs observable reaction that may potentially have no data?

How can scripts communicate with one another through passing arguments?

Tips for verifying the connections between an Angular application and Azure Function (negotiate) when integrating with Azure SignalR Service

Error message displaying that the argument for the onChange state in a jhipster react form is not assignable as type '{ [x: number]: any; }'

Can Envs in Bit be linked together?

Is it necessary to provide initialState in React Context when using useState in TypeScript, even if it serves no purpose?