vscode angular: running ngcc

Using VSCode to Run ngcc for Angular#

If you are working with Angular in VSCode, you may have encountered the need to run ngcc to compile your project's node_modules for Ivy compatibility. Here's how to do it:

Method 1: Using the VSCode Terminal#

The first way to run ngcc is to use the integrated terminal in VSCode. Here are the steps:

1. Open the terminal by pressing Ctrl + ` or by clicking on Terminal in the top menu and selecting New Terminal.
2. Navigate to your project's directory using the cd command.
3. Type ngcc and press Enter.

cd /path/to/your/project
ngcc

After running ngcc, you should see a message indicating that the process has completed successfully.

Method 2: Using the VSCode Tasks Feature#

The second way to run ngcc is to use the Tasks feature in VSCode. Here are the steps:

1. Create a new file in your project's root directory called tasks.json.
2. Add the following code to the file:

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "ngcc",
      "type": "shell",
      "command": "ngcc",
      "args": []
    }
  ]
}

1. Open the Command Palette by pressing Ctrl + Shift + P.
2. Type Tasks: Run Task and select it from the dropdown.
3. Select the ngcc task from the list and press Enter.

After running the task, you should see a message indicating that the process has completed successfully.

Conclusion#

Both methods allow you to run ngcc in VSCode. The first method is quicker and more straightforward, but the second method allows you to customize the command and add additional arguments if needed.