feat: Add option to disable ngcc (#1620)

Running ngcc is required for gathering metadata information of libraries
not published with Ivy instructions. However, ngcc can also be run
manually _outside_ of the extension. Developers may often be running a dev
server which does this step so doing it in the extension as well is
redundant. In addition, there have been issues with running it in VSCode
(#1353, #1444, and potentially other Nx related issues).

This option gives developers the ability to manually opt out of running
ngcc from the extension if it is proving to be problematic for their
setup.

Fixes #1353

Author: atscott

client/src/client.ts

@@ -410,6 +410,11 @@ function constructArgs(ctx: vscode.ExtensionContext, viewEngine: boolean): strin
     args.push('--includeCompletionsWithSnippetText');
   }
 
+  const disableNgcc = config.get<boolean>('angular.disableNgcc');
+  if (disableNgcc) {
+    args.push('--disableNgcc');
+  }
+
   const tsdk: string|null = config.get('typescript.tsdk', null);
   const tsProbeLocations = [tsdk, ...getProbeLocations(ctx.extensionPath)];
   args.push('--tsProbeLocations', tsProbeLocations.join(','));

package.json

@@ -123,6 +123,11 @@
           "type": "boolean",
           "default": true,
           "markdownDescription": "Enable/disable snippet completions from Angular language server. Requires using TypeScript 4.3+ in the workspace and the `legacy View Engine` option to be disabled."
+        },
+        "angular.disableNgcc": {
+          "type": "boolean",
+          "default": false,
+          "markdownDescription": "Manually disable the step to run ngcc. [ngcc](https://github.com/angular/angular/blob/master/packages/compiler/design/architecture.md#high-level-proposal) is required to run and gather metadata from libraries not published with Ivy instructions. This can be run outside of VSCode instead (for example, as part of the build/rebuild in the CLI). Note that ngcc needs to run not only at startup, but also whenever the dependencies change. Failing to run ngcc when required can result in incomplete information and spurious errors reported by the language service."
         }
       }
     },
@@ -223,4 +228,4 @@
     "type": "git",
     "url": "https://github.com/angular/vscode-ng-language-service"
   }
-}
+}

server/src/cmdline_utils.ts

@@ -32,6 +32,10 @@ interface CommandLineOptions {
    * If true, use Ivy LS, otherwise use legacy View Engine LS.
    */
   ivy: boolean;
+  /**
+   * If true, skips the running ngcc when using Ivy LS.
+   */
+  disableNgcc: boolean;
   logFile?: string;
   logVerbosity?: string;
   logToConsole: boolean;
@@ -45,6 +49,7 @@ export function parseCommandLine(argv: string[]): CommandLineOptions {
   return {
     help: hasArgument(argv, '--help'),
     ivy: !hasArgument(argv, '--viewEngine'),
+    disableNgcc: hasArgument(argv, '--disableNgcc'),
     logFile: findArgument(argv, '--logFile'),
     logVerbosity: findArgument(argv, '--logVerbosity'),
     logToConsole: hasArgument(argv, '--logToConsole'),

server/src/server.ts

@@ -43,6 +43,7 @@ function main() {
     ngPlugin: '@angular/language-service',
     resolvedNgLsPath: ng.resolvedPath,
     ivy: isG3 ? true : options.ivy,
+    disableNgcc: options.disableNgcc,
     logToConsole: options.logToConsole,
     includeAutomaticOptionalChainCompletions: options.includeAutomaticOptionalChainCompletions,
     includeCompletionsWithSnippetText: options.includeCompletionsWithSnippetText,

server/src/session.ts

@@ -27,6 +27,7 @@ export interface SessionOptions {
   ngPlugin: string;
   resolvedNgLsPath: string;
   ivy: boolean;
+  disableNgcc: boolean;
   logToConsole: boolean;
   includeAutomaticOptionalChainCompletions: boolean;
   includeCompletionsWithSnippetText: boolean;
@@ -54,6 +55,7 @@ export class Session {
   private readonly projectService: ts.server.ProjectService;
   private readonly logger: ts.server.Logger;
   private readonly ivy: boolean;
+  private readonly disableNgcc: boolean;
   private readonly configuredProjToExternalProj = new Map<string, string>();
   private readonly logToConsole: boolean;
   private readonly openFiles = new MruTracker();
@@ -80,6 +82,7 @@ export class Session {
     this.includeCompletionsWithSnippetText = options.includeCompletionsWithSnippetText;
     this.logger = options.logger;
     this.ivy = options.ivy;
+    this.disableNgcc = options.disableNgcc;
     this.logToConsole = options.logToConsole;
     // Create a connection for the server. The connection uses Node's IPC as a transport.
     this.connection = lsp.createConnection({
@@ -457,7 +460,7 @@ export class Session {
         const {project} = event.data;
         const angularCore = this.findAngularCore(project);
         if (angularCore) {
-          if (this.ivy && isExternalAngularCore(angularCore)) {
+          if (this.ivy && isExternalAngularCore(angularCore) && !this.disableNgcc) {
             // Do not wait on this promise otherwise we'll be blocking other requests
             this.runNgcc(project);
           } else {