Exclude checks on library folders in typescript

I'm currently working on an Angular 2 project with typescript and encountering numerous errors originating from the angular web-modules.

[error] node-modules\webjars\@angular\common\src\directives\ng_class.d.ts:80: TS2304 Cannot find name 'Set'.
[error]     rawClass: string | string[] | Set<string> | {
[error]                                   ^
[error] node-modules\webjars\@angular\common\src\facade\async.d.ts:33: TS2304 Cannot find name 'Promise'.
[error]     static fromPromise(promise: Promise<any>): Observable<any>;
[error]                                 ^
[error] node-modules\webjars\@angular\common\src\facade\async.d.ts:34: TS2304 Cannot find name 'Promise'.
[error]     static toPromise(obj: Observable<any>): Promise<any>;
[error]       

Clearly, I don't want these libraries to be checked by my typescript. Therefore, I have configured my tsconfig.json like this:

{
  "compilerOptions": {
    "target": "es5",
    "module": "system",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators":true,
    "sourceMap": true,
    "noImplicitAny":true,
    "noFallthroughCasesInSwitch":true,
    "noImplicitReturns":true,
    "outDir": "./target/ts"
  },
  "exclude": [
    "node_modules",
    "project/target",
    "typings/main",
    "typings/main.d.ts",
    "typings/browser",
    "target/web"
  ]
}

Is there anything else that I need to do?

Answer №1

It's interesting to note the changes made in the angular 2 quickstart guide regarding the tsconfig.json file. The removal of the exclude parameter raises some questions, but ultimately, it seems that focusing on the essentials is key. Personally, I feel that the exclude section should still be included and structured as follows:

tsconfig.json

...
"exclude": [
  "node_modules",
  "typings/globals"
]

Answer №2

After resolving the problem, I was able to successfully address it by reintegrating :

.../angular2/typings/browser.d.ts in my typings.d.ts

However, what perplexes me is that this specific file is sourced from angular2 (included in the beta-17 version), yet I am unable to locate anything similar in the most recent rc (4).

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

Explore the differences between the "date" type in HTML and the Date object in Typescript

Here is some code in HTML: <div class="form-group row"> <label class="col-sm-2 col-form-label">Due date: </label> <div class="col-sm-10"> <input type="date" class="form-control" #due_date> ...

What is the best way to send parameters to an async validator when working with reactive controls in Angular

Issue with Validation I am facing a challenge while using the same component for both read and edit routines. The async-validator functions perfectly when dealing with new entries. However, a problem arises if the user mistakenly changes a value and then ...

steps for making a specific cell editable in tabulatorI'm happy to help

click here for image description required initializeTabulatortableBng() { let thisClass = this; let bngTableData = thisClass.tableDataWorm; function formatDecimal(cell) { var value = cell.getValue(); if (value !== null && value !== undefine ...

Is there a way to obtain the dimensions of an image link in Angular?

Looking to verify the dimensions of an image link, specifically if it is 1000px x 1000px and in jpg format. For example: https://www.w3schools.com/bootstrap/paris.jpg I have this link and need to extract the width and height of the image. Determining t ...

Running ng build --prod does not compile the source code

Upon running the following command: ng build --prod utilizing the following versions: node version: v6.11.0 @angular/cli: 1.0.0-rc.2 typescript: Version 2.4.2 encountered errors as shown below: ERROR in ./src/main.ts Module not found: Error: Can ...

What could be causing my "Swiper" component to malfunction in a TypeScript React project?

In my React project, I decided to incorporate the Swiper library. With multiple movie elements that I want to swipe through, I began by importing it as follows: import Swiper from 'react-id-swiper'; Utilizing it in my code like this: <div cla ...

Implement a conditional block in my form validation process

Greetings, I have hit a roadblock with this issue for the past few days Here's the problem: I have an input field where I need to display a message based on certain conditions. One condition specifies that if it is a multiline text, use a textarea; o ...

Troubleshooting problem with @Input number in Angular 2

Here is the component in question: <component value="3"></component> This is the code for the component: private _value:number; get value(): number { return this._value; } @Input() set value(value: number) { console.log(v ...

Issues with the functionality of multiselect in Angular2-PrimeNg's reactive forms are currently being experienced

Currently, I am utilizing PrimeNG version 2.0.3 alongside Angular 2.0.0 while implementing reactive forms. My aim is to incorporate the multiselect functionality of PrimeNg into my form. To achieve this, I have taken the following steps: Component.html ...

Angular 5 Custom validators: Error message - 'passwordG' is not defined in ng

Currently working with Angular 5 and attempting to create custom validators for password inputs along with a confirmation password field. This is the HTML code : <div formGroupName = "passwordG"> <div class="form-group"> <label ...

Angular 6 TypeScript allows for efficient comparison and updating of keys within arrays of objects. By leveraging this feature

arrayOne: [ { id: 1, compId: 11, active: false, }, { id: 2, compId: 22, active: false, }, { id: 3, compId: 33, active: false, }, ] arrayTwo: [ { id: 1, compId: 11, active: true, }, { id: 2, compId: 33, active: false, ...

Encountering the "Error: data.map is not a function" issue within Next.js

I'm having trouble understanding why this first fetch call works perfectly: async function getData() { const res = await fetch('https://jsonplaceholder.typicode.com/todos') return res.json() } export default async function Home() { co ...

Angular todo app adds functionality to update array counts based on object properties

Hey there! I'm working on a todos app with CRUD functionality in Angular to get the hang of Angular 6. At the bottom, there's a link that shows how many todos are left to complete. Right now, this counter updates every time I add or remove a to ...

Angular 6 - Issue with ngModel displaying [object Object] instead of data in binding

Within my code, there is a variable named "data" that holds the following information: { id: 1, date: "2018-03-13T16:18:03", date_gmt: "2018-03-13T16:18:03", guid: {}, modified: "2018-05-03T17:25:36", modified_gmt: "2018-05-03T17:25:36", slug: "hello-worl ...

Change the type declaration of a list of elements to a list containing those elements organized within a container - Array<Wrapper<T>>

Is there a way to convert a plain array into an array of wrapped items in JavaScript? declare type MyGenericArray = [number, string, boolean] declare type WrappedGeneraicArray = Wrap<MyGenericArray> // WrappedGeneraicArr ...

What is the advantage of utilizing the "extends" keyword over directly stating the type?

Recently, I came across this interesting article at https://www.typescriptlang.org/docs/handbook/generics.html#generic-constraints I can't help but wonder why the extends keyword is necessary in this context. interface Lengthwise { length: number; ...

Refreshing a component in Angular/Angular2 using routerLink from the NavBar when already on the current route

When I am on the same route and click again from the navbar, nothing happens. Is there a way to refresh my component directly from the navbar using a method in routerLink? <li [routerLinkActive]="['active']"><a [routerLink]="['/ca ...

How to load a PFX certificate from a file in NodeJS

For my current project involving Node.JS and TypeScript, one of the key requirements is to encrypt the payload body using a PFX certificate read from a .pfx file. The certificate I have is named cert1.pfx, and my code necessitates utilizing this certifica ...

Angular 8 Refresh Token Implementation

I am currently working on an Angular 8 app that is integrated with .NET Core. My goal is to find a way to refresh a JWT token within the application. Within the integration, users are able to validate and receive a token which expires after 30 minutes. T ...

Creating a responsive d3 gauge chart: A step-by-step guide

Need assistance resizing the d3 gauge chart. Check out the Stackblitz code for reference. I've attempted the following: .attr("preserveAspectRatio", "xMinYMin meet") as well as window.addEventListener("resize", this.draw); ...