Suppress Angular Language Service VSCode extension's "strictTemplates in angularCompilerOptions" notification

19.8k Views Asked by At

Since we upgraded our codebase to Angular 11 I get this message in VSCode:

Some language features are not available. To access all features, enable strictTemplates in angularCompilerOptions.

Source: Angular Language Service (Extension)

With a link to "Open tsconfig.json", like this:

visualization of above described text

I'm looking forward to enabling this and enjoying the new feature. But I want to set time apart to do and test this. For now, the popup in VSCode keeps coming up all the time, which is annoying and distracting.

How can I (for now) suppress this message, preferably for my current workspace?


  • Angular Language Service (angular.ng-template) v11.2.3
  • Visual Studio Code version 1.53.2 on Windows 10
7

There are 7 best solutions below

0
On BEST ANSWER

If you create a .code-workspace file for your workspace, you can add the following to disable the prompt:

    "settings": {
        "angular.enable-strict-mode-prompt": false
    }

Note: if you open the workspace, the prompt shown above should have an additional button to add this setting for you:

popup with button "Do not show again"

0
On

For Angular 10+ :

Just add these lines:

"angularCompilerOptions": {

   "fullTemplateTypeCheck": true,
   "preserveWhitespaces": true

}

For more, here's the documentation : Doc

1
On

Open tsconfig.json file from root location. Add "strictTemplates": true

This is how tsconfig.json looks :

/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "module": "es2020",
    "lib": ["es2018", "dom"]
  },
  "angularCompilerOptions": {
    "enableI18nLegacyMessageIdFormat": false,
    "strictTemplates": true
  }
}
0
On

In Angular 12 the Ivy is the default engine. And when you have Version 11 installed locally and your Angular Language Service Extension is in version 12, You start to get that message the options are either to update your local copy of angular(and dependencies) to version 12 and configure the compiler, or Install a lower version of the Angular Language Services as shown in some of the answers above.

Or click that option in the Angular Language Service Click that option to get rid of that message

Of course is discouraged to do that. As the future is Ivy :). But is a temporary option until everything is ready among the community and the different dependencies

2
On

Hi guys I had the same problem but I did this and that message stopped showing... I hope help us.

tsconfig.json

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "types": ["node", "jest"]
  },
  "include": [...],
  "angularCompilerOptions": {
    "strictTemplates": true
  }
}

Configuration

3
On

I had the same problem, and it seems it disappeared by installing Angular Extension Pack.

2
On

Here's the PR that introduced this warning: https://github.com/angular/vscode-ng-language-service/pull/1097

Does your project use multiple .tsconfig files? I believe every time a new .tsconfig is found the Angular Language Service needs to restart, which triggers this error. I'm going to look into why there isn't an option to suppress the error permanently.