I am puzzled by the Angular production build error I encountered - specifically, the ./src/app/app.module.ngfactory.js

When attempting to run ng serve --prod, I encountered the following error: $ ng build --prod error

ERROR in ./src/app/app.module.ngfactory.js Module not found: Error: Can't resolve 'ngx-bootstrap/dropdown/bs-dropdown.module' in 'C:\Users\MadOrWat\Desktop\gsipKOtakUI\pro\sameProdGsip\src\app'

Here are the current versions of my app: https://i.sstatic.net/WxkKT.png

I also tried using ng add @angular/pwa --project app

However, I am encountering another issue with a message stating "Maximum call stack size exceeded"

Answer №1

The ngx-bootstrap bridge is currently experiencing some issues with rxjs. To resolve this, it is recommended to perform a manual npm install of Bootstrap, ideally the stable or latest version. This solution should address the issue and allow the bridge to function properly.

I followed these steps myself and found success:

npm install <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="92fcf5eabff0fdfde6e1e6e0f3e2d2a1bca2bca3">[email protected]</a> 

Best of luck, Hari

Answer №2

Stumbled upon a problem while exploring the ngx-bootstrap github repository:

Encountering ngx bootstrap error with Angular -v6.0.0 and rxjs -v6.0.0

Within the discussion, came across an intriguing response suggesting:

Noting that rxjs v6 brings several changes that may impact imports of operators. Suggested solution is to install rxjs-compat, which retains previous import paths until full migration.

Feel free to give it a shot, hopefully this workaround 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

The JSON object cannot be assigned to the IntrinsicAttributes and customType data types

Currently, I'm facing a challenge with reading JSON data into an array of type pinImage. My goal is to loop/map through my pinImage objects and pass each one to a child component called PinCard, which is specifically designed to accept an object of ty ...

Tips for sending the image file path to a React component

Hey, I'm working on a component that has the following structure: import React from "react"; interface CInterface { name: string; word: string; path: string; } export function C({ name, word, path }: CInterface) { return ( < ...

Unable to locate TypeScript's before() and after() methods

Having trouble running TypeScript tests with Jest/SuperTest - when running npm test, I encounter the following errors: Which package am I missing or not importing? FAIL test/test.ts ● Test suite failed to run test/test.ts:8:3 - error TS2304: Ca ...

Leveraging Angular2 router functionality on the Heroku platform

My Angular2 application is successfully deployed on Heroku and functions properly with the "www.example.com" format. However, when I try to access a specific page by typing "www.example.com/page" into the search bar, it returns an error saying "cannot G ...

Angular Universal causing issues with updating the DOM component

@Component({ selector: 'mh-feature-popup', template: ` <div class="full"> <div> <div class="container-fluid" [@featurepop]="state"> <div class="row"> <div class="col-xs-12 col-md-4 col-md-offse ...

TypeScript stack trace not displayed in Angular stack trace when in development mode

Currently, I am working on a project using a 'fuse angular template' in order to speed up development and avoid the need to write numerous components. To get started, clone the repository from https://github.com/deanhiller/ts-prototype Please no ...

The error message `Error [ERR_REQUIRE_ESM]: require() of ES Module` is triggered when attempting to call the old

I've been attempting to integrate with the Unsplash API, but I'm encountering an issue. When I try to execute the script using ts-node like this: ts-node unsplash.ts I receive the following error: C:\Users\USER\AppData\Roamin ...

Angular version 6 with Popper.js integration (minus the use of jQuery)

I've been working on integrating Popper.js with Angular 5, but I'm not using Bootstrap or JQuery. I tried to follow the instructions on this link, but it wasn't very straightforward for Angular applications. First, I installed Popper.js via ...

It is impossible for me to invoke a method within a function

I am new to working with typescript and I have encountered an issue while trying to call the drawMarker() method from locateMe(). The problem seems to be arising because I am calling drawMarker from inside the .on('locationfound', function(e: any ...

Angular Regular Expression Directive

I am attempting to develop an Angular Directive in Angular 7 that allows users to input a RegExp through an input property and restricts them from typing characters that do not match the specified RegExp pattern. While it is partially functional, I am enc ...

Angular: Issue with Pipe functionality

Recently, I've encountered an issue with a pipe that I created. Despite having what seems like clear and straightforward code, I can't seem to pinpoint the exact issue. Any thoughts or suggestions on what might be causing this problem? Here&apo ...

The absence of angular-cli.json is evident, as it is not hidden from

Recently starting an Angular course, I encountered an issue where my angular-cli.json file was missing. Despite researching online and checking hidden files, I still couldn't locate it. Even creating a new project didn't solve the problem. I&apo ...

Invoking event emitter within a promise in Angular 2

My event emitter is not functioning properly within a promise's then method. No errors are being generated, it just won't execute. In the child component: @Output() isLoggingIn = new EventEmitter<boolean>(); onLogin() { this.isLoggingI ...

A more efficient method for defining and utilizing string enums in Typescript

enum PAGES { HOME = 'HOME', CONTACT = 'CONTACT', } export const links: { [key: string]: string } = { [PAGES.HOME]: '/home', [PAGES.CONTACT]: '/contact', }; export function getLink(page: string) { return B ...

Enhance your Angular application with stylish PrimeNG Menubars

I am currently working on a project using primeng 4.3.0 & Angular 4, where I am designing a horizontal menu for my various pages. Unfortunately, I am unable to update the version of these components, hence I have a question: While utilizing the menubar an ...

Encountering a snag in Angular 2 while attempting to utilize Publish and Connect for generating a Hot observable

I am attempting to create a Hot observable using the RxJS API in Angular 2, inspired by a similar example in http://jsbin.com/fewotud/3/edit?js,console However, when I try to use "Publish," the debugger indicates that the Publish function is undefined. So ...

Retain the parameter name when defining a function type mapping

Imagine you need to change the result of a function: (bob: Bob) => R => (bob: Bob) => R2 Is it possible to achieve this without changing the argument name? (e.g bob instead of using a general name like a) ...

Active Class in Angular Dynamic Carousel

I recently set up a dynamic carousel that pulls images directly from a node backend. While everything seems to be in working order, I've run into an issue where all the images are being displayed at once instead of sliding through one at a time. This ...

Implementing typing for a module that exports an instance of a particular class

Attempting to create a .d.ts file for the foo-foo-mq module has presented some challenges. Following the documentation, a 'foo-foo-mq' folder was created within the 'typings' directory at the project's root. An index.d.ts file was ...

What is causing the error message "Module '@reduxjs/toolkit' or its type declarations are not found" to appear?

Although I have a good understanding of React-Redux, I decided to delve into TypeScript for further practice. Following the recommended approach from the react-redux team, I created a new project using the TS template: "npx degit reduxjs/redux-templa ...