Leverage tsconfig.json within the subfolders located in the app directory during Angular build or ng-build process

In our Angular project, I am attempting to implement multiple tsconfig.json files to enable strictNullChecks in specific folders until all errors are resolved and we can turn it on globally.

I have been able to achieve this functionality by using "references" in the root tsconfig file and "extends" in the subfolder(s) when running the tsc command.

However, this approach does not work when running ng-build as the build process completes without any issues. Has anyone successfully implemented this or have any insights into why it may not be working in this scenario?

angulartypescripttsconfig

Answer №1

In my view, a strategy similar to nx could be beneficial for organizing your project. Consider breaking it down into a main project with several sub-projects (libs), and then reference them in angular.json as individual projects. Here's an example:

{
   "$schema": "./node_modules/nx/schemas/workspace-schema.json",
   ...
   "projects": {
     "project-1": "libs/project-1",
   }
}

For more information, refer to the workspace docs at: https://angular.io/guide/file-structure

While this may not directly address your question, I believe it offers a cleaner approach to solving the problem. Additionally, it allows for customization such as using specific tsconfig.json files for tests.

I hope you find this helpful!

Answer №2

Unfortunately, it appears that achieving this is not a viable option at the moment.

To address this issue, I have opted to incorporate the necessary check into our build process as a temporary solution.

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

How to access elements by their class name in Angular

Recently, I encountered a situation with this specific span element: <span *ngFor="let list of lists[0].question; let i = index" id="word{{ i }}" (click)="changestyle($event)" class="highlight"> {{ list}} < ...

angulartypescript

Determine whether there are a minimum of two elements in the array that are larger than zero - JavaScript/Typescript

Looking for an efficient way to determine if there are at least two values greater than 0 in an array and return true? Otherwise, return false. Here's a hypothetical but incorrect attempt using the example: const x = [9, 1, 0]; const y = [0, 0, 0]; c ...

javascripttypescript

Can someone guide me on configuring Material-UI DataGrid in React to have multiple headers with column span?

Is there a way to achieve multiple headers with column span in the Material-UI DataGrid component? view image example ...

reactjstypescriptmaterial-ui

Guide to retrieving the previous URL in Angular 2 using Observables

Can someone help me retrieve my previous URL? Below is the code snippet I am working with: prev2() { Promise.resolve(this.router.events.filter(event => event instanceof NavigationEnd)). then(function(v){ console.log('Previous ' ...

javascriptangulartypescript

Show a few values as a string in Angular using Typescript

I am working with JSON data and I want to know how to display hobbies without including the word "all" in an Angular/TypeScript application. { "Name": "Mustermann1", "Vorname": "Max1", "maennlich& ...

htmlangulartypescript

The variable "$" cannot be found within the current context - encountering TypeScript and jQuery within a module

Whenever I attempt to utilize jQuery within a class or module, I encounter an error: /// <reference path="../jquery.d.ts" /> element: jQuery; // all is good elementou: $; // all is fine class buggers{ private element: jQuery; // The nam ...

javascriptjquerytypescript

Sending a Thunk to the store using Typescript

Within my primary store.ts file, the following code is present: const store = createStore( rootReducer, composeWithDevTools(applyMiddleware(thunk)) ); store.dispatch(fetchUser()); Upon initial rendering, an action is dispatched to fetchUser in ord ...

javascriptreactjstypescriptreduxredux-thunk

Angular4 ASP.NET Core project does not seem to be detecting the API endpoints

I am encountering an issue with my angular application where I consistently receive a "Cannot match any routes" error when attempting to access certain api resources. The base in my application is configured as <base href="/"> and the api source is ...

angularasp.net-core

Protecting NestJS API for Angular App with Auth0

Currently, I am working on an Angular application that utilizes NestJS as the backend. Authentication is functioning properly in the Angular app, where users can log in to Auth0 and are redirected back to our app seamlessly. The /token call in the network ...

angularnestjsauth0

Angular issue: "anticipated to exit Angular zone, yet still found within"

I'm currently in the process of building a web application using Angular, and an error keeps appearing in the Chrome console: https://i.stack.imgur.com/sikuu.png Initially, I ignored the error as it didn't seem to impact the app's functiona ...

angulartypescript

Error: The JSON.parse method encountered an unexpected token 'h' at the beginning of the JSON string while trying to parse it

Here is the code snippet I wrote using Ionic framework: dialogflow(question) { let headers = new Headers(); headers.append('Content-Type','application/json'); return this.http.post('http://localhost:3000/api/dialogflow ...

angularexpressionic3httprequestmean-stack

In TypeScript and React, what is the appropriate type to retrieve the ID of a div when clicked?

I am facing an issue in finding the appropriate type for the onClick event that will help me retrieve the id of the clicked div. const getColor = (event: React.MouseEvent<HTMLDivElement, MouseEvent>) => { const color = event.target.id; // ...

reactjstypescript

Mastering the Conversion from NGRX Effect to NGRX Effect v15

I am currently working on converting the code snippet to NGRX 15. As a newcomer to Angular, I could use some guidance. "@ngrx/effects": "^15.4.0" @Injectable() export class SnackbarEffects { @Effect({ dispatch: false }) cl ...

angulartypescriptngrxngrx-effects

Having trouble retrieving an Enum within an Angular template?

I am trying to use an enum to read a property of an array. However, I encountered an error with the following code: <ng-container *ngFor="let elem of list"> <div class="ui-g-12 ui-sm-12 ui-md-12 ui-lg-12 ui-xl-12"> &l ...

angulartypescriptenumsangular2-template

Using TypeScript with Vue and Pinia to access the store

Is it necessary to type the Store when importing it to TypeScript in a Pinia Vue project? // Component <p>{{ storeForm.firstName }}</p> // receiving an error "Property 'storeForm' does not exist on type" // Store ...

javascripttypescriptvue.jsimportpinia

Can getters and setters be excluded from code coverage reports in Angular projects?

Looking to clean up my coverage reports for the front end portion of an angular project by removing trivial code like getters and setters. I generate my reports using npm run test-sonar -- --coverage, but everything is included in the report when I view ...

angulartypescriptnpmsonarqubecode-coverage

Is it possible to continuously activate an Angular Input setter using a Subject?

Is there a way to activate an @Input setter without providing a value, by utilizing RxJS' Subject()? It seems that the setter only gets triggered once, most likely because no value has been changed. How can I ensure that the input is activated every ...

angularrxjsbinding

What purpose does the # symbol serve in Angular when interpolating values?

Here is an example provided from the following link: https://angular.io/guide/lifecycle-hooks export class PeekABoo implements OnInit { constructor(private logger: LoggerService) { } // Implementing OnInit's `ngOnInit` method ngOnInit() { this ...

angulartypescript

Angular 4, Trouble: Unable to resolve parameters for StateObservable: (?)

I've been working on writing unit tests for one of my services but keep encountering an error: "Can't resolve all parameters for StateObservable: (?)". As a result, my test is failing. Can someone please help me identify and fix the issue? Here& ...

javascriptangularunit-testinghttpkarma-jasmine

The mapStateToProps function in a Higher Order Component is receiving an OwnProps argument with a property that is not defined

I'm a new user of react-redux trying to connect a higher-order component to the react-redux store. In the mapStateToProps function, I'm using the ownProps argument to filter the state. However, the property I'm trying to use within OwnProps ...

reactjstypescriptreduxreact-redux