What steps can I take to uncover the root cause of a "Debug Error" within TypeScript's compiler?

While trying to run nx serve (using NRWL NX) on my TypeScript project, I encountered a build failure with the following error message:

<my-file>.ts - Error: Module build failed (from ./node_modules/@ngtools/webpack/src/ivy/index.js):
Error: Debug Failure. False expression: Lexical environment is suspended.

<my-file>.ts1 has not been modified for some time and was compiling correctly after my last changes a few days ago.

I'm inclined to believe that this issue may be related to a bug in the TS compiler or something similar. Is there any way to identify which specific part of <my-file>.ts is causing the problem or what types of constructs could potentially trigger this error?

A few details about the setup:

  • The nx serve command triggers the 
    @angular-devkit/build-angular:dev-server
    executor.
  • This, in turn, utilizes the 
    @angular-devkit/build-angular:browser
    executor for project building.

1: Please note that '<my-file>.ts' serves as a placeholder here.

typescriptwebpackangular-ivy

Answer №1

During a Jest test, I managed to replicate the issue with an error.

The discrepancy lies in a method declaration within an Angular service:

public async doSomething<T extends object>(): Promise<{
  get value(): number
}> {
// ....

(The code above triggers the "Error: Debug Failure. False expression: Lexical environment is suspended." message)

Contrast this with:

public async doSomething<T extends object>(): Promise<{
  readonly value: number
}> {
// ....

(The second version does not result in any compiler errors)

Regrettably, I could not reproduce this scenario on the TS Playground. Therefore, I do not have a standalone example to provide at this time. Nonetheless, this information may be helpful for future users encountering similar issues.

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

Can you please provide instructions on how to obtain the TypeScript definitions file for a specific version of Jquery, such as 3.2.1

As I navigate my way through TypeScript, I find myself in need of accessing type definitions for a jQuery project in Visual Studio. The project currently utilizes jquery version 3.2.1, and I'm on the lookout for TypeScript type definitions for it. Af ...

jqueryvisual-studiotypescriptnpmtypescript-typings

What is the method for filtering out specific fields in a template string?

I am currently working on defining constraints for the method field type event = { [k: `on${string}`]:(e:string)=>void } However, I need the event argument to be a number for fields that do not begin with 'on' type event = { [k: ` ...

typescript

Divide a JavaScript project into multiple packages using either webpack or npm

I am embarking on the development of an application that needs to be compatible with Windows (PC), Android, and iOS. To achieve this, I plan to use Electron for Windows and React Native for mobile platforms. Both applications will be built using React and ...

javascriptnode.jsnpmwebpackredux

Is there a way to display the input value from an on-screen keyboard in an Angular application?

https://i.sstatic.net/j76vM.pnghttps://i.sstatic.net/EQPZO.png I have included my code and output snippet below. Is there a better way to display the input value when clicking on the virtual keyboard? ...

javascriptangulartypescript

Obtaining a customized variation of a class identified by a decorator

I am working with a class that is defined as follows: class Person { @OneToOne() pet: Animal; } Is there a method to obtain a transformed type that appears like this? (Including {propertyKey}Id: string to properties through the use of a decorator) ...

typescriptgenericsdecoratorreflect-metadata

What is the reason behind the absence of forEach method on NodeListOf?

Here is the code that I wrote: var checkboxes = this.element.querySelectorAll("input[type=checkbox]") as NodeListOf<HTMLInputElement>; checkboxes.forEach(ele => { var key = ele.name; if (data.hasOwnProperty(key)) { ...

javascripttypescript

Previewing multiple selected files in Angular interface

As a newcomer to Angular, I am currently working on a feature that involves selecting multiple files and displaying their previews before uploading them to the server. While my code works correctly when individual files are selected one at a time, it fail ...

javascriptangulartypescript

Is it possible to integrate a personalized theme into react-dates?

Attempting to customize the styling of my react-dates DayPickerRangeController in Typescript using react-with-styles and Aphrodite. I have implemented the following code, mirroring the code found at https://github.com/airbnb/react-dates#interfaces: const ...

reactjstypescriptreact-datesaphroditereact-with-styles

Determine element height in Angular 5 by clicking on it

Currently, I am experimenting with determining the height of an element that I click on within a sidebar. The purpose is to display submenus accordingly. Below is the code snippet that I am working on: <li (click)="newsExpanded = !newsExpanded; getMarg ...

htmlangulartypescriptangular5

Connecting the list elements to the current state

My React component is defined as: export default class App extends React.Component<AppProps, Items> The Items class is declared as: export default class Items extends Array<Item> where Item is a class with various properties. When I direct ...

reactjstypescript

Modifying the NestJS Decorator string parameter upon library import: A step-by-step guide

I am working with a NestJs monorepo that contains several Apps (microservices) and Libs. One common Service class is used across all apps, so I decided to extract it into a separate lib. Initially, I thought this was a good idea. However, I soon realized ...

typescriptdependency-injectionnestjsmonorepotypescript-decorator

Exploring the potential of TypeScript with native dynamic ES2020 modules, all without the need for Node.js, while also enhancing

I have a TypeScript application that utilizes es16 modules, with most being statically imported. I am now looking to incorporate a (validator) module that is only imported in debug mode. Everything seems to be functioning properly, but I am struggling to f ...

javascripttypescriptimportecmascript-2020

One function must pause and await the outcome of another function

I am developing a form that utilizes the data of the currently logged in user. The function responsible for setting the value of the form is executed before retrieving the user data. ngOnInit() { this.auth.getUserState() .subscribe( user => { ...

angulartypescript

Splitting Angular modules into separate projects with identical configurations

My Angular project currently consists of approximately 20 different modules. Whenever there is a code change in one module, the entire project needs to be deployed. I am considering breaking down my modules into separate projects for individual deployment. ...

javascriptangulartypescriptuser-interfacemicro-frontend

What specific element is being targeted when a directive injects a ViewContainerRef?

What specific element is associated with a ViewContainerRef when injected into a directive? Take this scenario, where we have the following template: template `<div><span vcdirective></span></div>` Now, if the constructor for the ...

htmlangulartypescript

Defining a JSON file interface in Angular to populate a dropdown box with dependencies

I've embarked on an exciting project to develop a cascading dropdown box filter, and it's proving to be quite challenging. I'm taking it step by step to ensure clarity. I have obtained a JSON file containing the data required to populate de ...

angulartypescript

Tips on changing the color of a dropdown select option in Angular 8

I have been experimenting with changing the color of a dropdown select menu based on the value selected by the user. Here is the code I have been working with: App.component.ts @Component({ selector: 'my-app', templateUrl: './app.comp ...

javascripttypescriptangular8

The Material-UI TextField is placed in the Header section of the page

As I scroll down the page, I noticed that the TextField in the header area remains visible. This header is styled using CSS and includes a TextField from the material-ui library. This is my first time creating a header with CSS. Are there any specific cod ...

cssreactjstypescriptmaterial-ui

A guide to effectively injecting a service into a guard

I've encountered a challenge while working on an API using nestjs, specifically with service injection in a guard. The error message I'm facing is: Error: Nest can't resolve dependencies of the AuthorizerGuard (?). Please make sure that the ...

typescriptnestjsbackend

Enforcing TypeScript restrictions on method chaining during object creation

Let's consider this unique sample class: class Unique { public one(): Pick<this, "two" | "three"> { return this; } public two(): Pick<this, "three"> { return this; } public three(): string { ...

typescript