Angular strict mode
February 09, 2020
Strict Angular
If you like to have your TypeScript type checking to be stricter, there are a
few settings that can be turned on within your ts.config
.
TypeScript Compiler Options
When generating a new project from the Angular CLI
with the --strict
flag, the following compiler options are added to
tsconfig.json
for you.
// tsconfig.json
{
"noImplicitAny": true,
"noImplicitReturns": true,
"noImplicitThis": true,
"noFallthroughCasesInSwitch": true,
"strictNullChecks": true,
}
These settings do not encompass all of TypeScripts strict
flag as detailed in
the TypeScript compiler
docs,
just a subset.
// tsconfig.json
{
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
}
Are options that TypeScript would not turn on with its strict
flag.
If you would like to make your Angular project fully strict, replace the provided options like so:
// tsconfig.json
{
"strict": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
}
Angular Compiler Options
Angular compiler options
are added within tsconfig.json
. For projects built with the
Angular CLI fullTemplateTypeCheck
will be defaulted
on.
{
"angularCompilerOptions": {
"fullTemplateTypeCheck": true,
}
}
Although defaulted off, it is recommended within the Angular documentation that
strictInjectionParameters
is turned on.
{
"angularCompilerOptions": {
"strictInjectionParameters": true,
}
}
As of Angular 9, with Ivy turned on we can also turn on Strict mode for template checking.
{
"angularCompilerOptions": {
"strictTemplates": true
}
}
This is a superset of fullTemplateTypeCheck
so when strictTemplates
is turn
on you can remove the config for fullTemplateTypeCheck
, ending up with
something like this:
{
"angularCompilerOptions": {
"strictInjectionParameters": true,
"strictTemplates": true
}
}