An issue has been encountered: No NgModule metadata was discovered for 'AppModule' in the ngx-rocket Metronic theme

Task List

  • [ ] Initialize
  • [x] Build
  • [x] Serve
  • [ ] Test
  • [ ] End-to-End test
  • [ ] Generate
  • [ ] Add
  • [ ] Update
  • [ ] Lint
  • [ ] Internationalization
  • [ ] Run
  • [ ] Configure
  • [ ] Help
  • [ ] Version
  • [ ] Documentation

Is this a regression?

This issue started occurring in the current version without any updates or upgrades.

Description of Issue

The bug has two components: one during the 'serve' command and another during build creation.

Description During Serve Process

During development, an error occurs when running npm start: "ERROR in No NgModule metadata found for 'AppModule'." Re-saving a file triggers successful compilation.

Description During Build

While building, it fails with the error: "ERROR in members.hasOwnProperty is not a function."

🔬 Steps to Reproduce

The issue occurred during development without any specific steps to reproduce.

🔥 Exception or Error

Exception during SERVE:

No other exception is present besides the error mentioned above.

Exception during BUILD:

No additional exceptions are identified, just the specified error. The following details were recorded:

(details here)

My Environment Setup

Angular CLI: 8.3.22
Node: 12.13.1
OS: Windows 10 x64
Angular: 8.2.14
... (other dependencies listed here)

Any Additional Information? Tried various reported workarounds but none have resolved the issue. Assistance would be greatly appreciated as I need to deploy the application but unable to create a production build.

Main Application File (main.ts)

(contents here)

App Module File (app.module.ts)

(contents here)

App Routing Configuration File (app-routing.module.ts)

(contents here)

Similar issue reported on Github: ERROR in No NgModule metadata found for 'AppModule'

Your assistance in resolving this matter is highly valued. Thank you for your help in advance.

angulartypescriptnpmangular8metronic

Answer â„–1

It's great news that the community has identified the root cause of this issue. One major factor was an issue with the angular compiler itself. For more information, please check out these links:

Fix for NG Serve Issue

Solution for NG Build Problem

I hope this information proves useful.

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

Unlock the full potential of ts-transformer-keys in your Vue application

note: After spending countless hours on this, I finally had a breakthrough today. It turns out that changing transpileOnly to false made all the difference: chainWebpack: config => { const getCustomTransformers = program => ({ before: [ ...

typescriptvue.jswebpackvue-loader

"Enhance user experience with Angular Material: Popup Windows that preserve functionality in the original window while staying vibrant and accessible

Exploring Angular Material Dialog and other Popup Window Components for a project. Making progress but facing some challenges. Here are the requirements: a) The original screen should not be grayed out, b) Users should be able to interact with the windo ...

angulartypescriptangular-materialangular8material-dialog

Angular template error: Potential is present but not defined

Encountering an issue with my Angular application's template file (dashboard.component.html). The error message reads "Object is possibly 'undefined'." Here's the portion of the template that seems to be causing the problem: <div> ...

angulartypescriptangular17

Error Message: "Unable to locate module for Angular 5 UI Components packaging"

In the process of developing UI Components to be used in various web projects throughout the company, we are aiming to publish these components as an npm package on our local repository. It is crucial for us to include the sources for debugging purposes. F ...

angulartypescriptnpmes6-modules

Formcontrol is not functioning properly with invalid input

I am attempting to style an input field with a FormControl using the :invalid pseudo-class. Here is my code snippet: scss input:invalid { background-color: red; } html <input type="text" [formControl]="NameCtrl"> Unfortunate ...

htmlcssangularinputcss-selectors

What is the best way to construct this query using Node.js with Sequelize?

I am currently working with Codeigniter code, but I want to convert this query to Node.js db.where('feature', feature); db.where(1); for (let i = 0; i < payment12.length; i++) { db.orWhere("FIND_IN_SET('" + payment12[i] + "', pa ...

node.jscodeigniternpmsequelize.js

Strategies for managing common dependencies while distributing components across various applications within a monorepo

In my monorepo, the structure is as follows: root --AppOne ----package.json ----node_modules ------styled-components --AppTwo ----package.json ----node_modules ------styled-components --Shared ----componentA ----package.json ----node_modules ------style ...

npmwebpacknode-moduleswebpack-4styled-components

Error encountered in the integrated terminal of VS Code when attempting to run the command `npm version patch

Running npm version patch command in the integrated terminal of VS Code is causing a failure, and here is the error log: 'add', info git 'C:\\Users\\User\\source\\repos\\ client\&bso ...

gitvisual-studio-codenpmterminal

Step-by-step guide on importing Nano (CouchDB) using Typescript

I am facing difficulty in importing and using nano in my node application. According to the documentation, the JavaScript way is: var nano = require('nano')('http://localhost:5984'); How can I achieve this with TypeScript? I attempt ...

typescriptcouchdbnode-modulescouchdb-nano

What could be causing the issue preventing me from updating an npm library to the latest version and keeping me stuck with an older version?

Currently, I am using Node v14.16.1 and npm 7.9.0 I'm trying to update the Firebase-tools library by running either sudo npm upgrade firebase-tools -g or sudo npm install -g firebase-tools to ensure that I have the latest version of firebase-tools. ...

node.jsfirebasenpmnpm-install

Creating dynamic elements in Angular2 componentsIn Angular2, you can seamlessly

Utilizing the Google Maps JavaScript API in my project, I faced the challenge of displaying an Angular component within an InfoWindow. After loading the Google Maps API with the Jsonp service, I had access to the google.maps.Map object. In a component, I ...

google-mapsangular

Delete a particular item from a JSON object in real-time using TypeScript/JavaScript

Upon examining the JSON data provided, it contains a node called careerLevels which includes inner child elements. input = { "careerLevelGroups": [ { "201801": 58, "201802": 74, ...

javascriptarraysjsontypescript

Installing multiple versions of the same package with Yarn

In my dependencies, I have included angular at version 1.5.11: { "dependencies": { "angular": "1.5.11", "angular-foundation": "0.7.0" } } The dependency angular-foundation relies on angular@>=1.3.0. I am wondering why Yarn ins ...

npmyarnpkg

Setting up a Wordpress Docker environment behind an Nginx Proxy Manager without using SSL encryption

Recently, I set up a docker stack comprising WordPress, MySQL, and phpMyAdmin. The Nginx proxy manager within the docker system listens to the domain and directs traffic to the stack, along with obtaining a Let's Encrypt certificate through NPM. Withi ...

wordpressdockersslnpmcontainers

What is the syntax for declaring a variable as a string or a function with parameters?

Is it possible to define a variable in TypeScript like a string or as a Function, but with specific parameters? I am aware of how to define a string actionGetData: string; and a function actionLoaded?(event: any, ui: any): void;, but when I try to define ...

typescripttypescript-typings

By utilizing a function provided within the context, React state will consistently have its original value

After passing functions from one component to its parent and then through context, updating the state works fine. However, there is an issue with accessing the data inside these functions. They continue to show as the initial data rather than the updated v ...

reactjstypescriptnext.js

guide to utilizing npm/yarn with tsx react

I've recently made the switch to using TypeScript with React, but I'm encountering a problem. After installing certain packages from npm or yarn, I'm having trouble using them in my .tsx components. The error message suggests looking for @ty ...

reactjstypescripttsx

When developing libraries in webpack, which dependencies should be considered as peer dependencies?

Our team is in the process of developing reusable React components. Each component will be packaged as an npm library with webpack. We are debating whether each library should declare its dependencies as peer dependencies and rely on the application to i ...

reactjsnpmwebpackpackage.json

What is the best way to pass the username and token data from a child component to its parent component

Hey, I'm currently working on a login app in React where the login component is a child of the app. My goal is to send back the username and token to the parent component once a user is logged in, so that I can then pass this information to other chil ...

reactjstypescript

What is the best way to retrieve a property with a period in the method name in JavaScript?

One dilemma I'm facing is trying to access the tree.removenode method through chartContext in Angular. It's been a challenge for me to understand how to achieve this. https://i.stack.imgur.com/yG7uB.png ...

javascriptangular