This command is not available when running the Angular CLI outside a workspace

# This command is not available when running the Angular CLI outside a workspace

The error "This command is not available when running the Angular CLI outside a workspace" occurs when your terminal isn't positioned in the root directory of an Angular project when running the ng serve command.

To solve the error, navigate to the root directory of your project (where your angular.json file is) and rerun the command.

# Create an Angular project if you don't already have one

In case, you don't have an Angular project, you can create one with the following commands.

Copied!
# 👇️ install the `angular` CLI globally
npm install -g @angular/cli@latest

# 👇️ create a workspace
ng new my-project

# 👇️ run the application
cd my-project
ng serve --open

You can use the cd command to change your terminal to the root directory of your Angular project.

Copied!
# 👇️ list files and directories
dir

# 👇️ make sure to replace with the name of your project
cd your-angular-project

ng serve --open

And here is an example of how to do it on macOS and Linux.

Copied!
# 👇️ list files and directories
ls

# 👇️ make sure to replace with the name of your project
cd your-angular-project

ng serve --open

# Open your terminal in the root directory of your Angular project

Alternatively, you can open your terminal directly in the root directory of your Angular project (where your package.json) file is located.

Here is what the root directory of your Angular project should look like. This is the directory where you should open your shell.

For example, on Windows:

1. Open the root directory of your Angular project (where angular.json and package.json are located) in explorer.

2. Press Shift and right-click in Explorer.

3. Click on "Open PowerShell window here".

4. Run the ng serve --open command.

Copied!
ng serve --open

On macOS and Linux:

1. Open the root directory of your Angular project (where angular.json and package.json are located).
2. Right-click and click "Open in terminal".

3. If you don't see the "Open in terminal" option, right-click and press E on your keyboard.

4. Run the ng serve --open command.

Copied!
ng serve --open

If you don't have an Angular project, you can create one with the following commands.

Copied!
# 👇️ install the `angular` CLI globally
npm install -g @angular/cli@latest

# 👇️ create a workspace
ng new my-project

# 👇️ run the application
cd my-project
ng serve --open

# Open your terminal in your project's root directory within your IDE

An alternative way to solve the error is to open your terminal in your project's root directory in your IDE (e.g. Visual Studio Code).

This is what the root directory of my Angular project looks like in Visual Studio Code.

You can press CTRL + ` (Backtick) on your keyboard to open the Visual Studio code terminal.

Once you open the terminal in your project's root directory, run the ng serve --open command.

Copied!
ng serve --open

# Using the "Open in integrated terminal" option

An alternative approach to solve the error is to:

1. Open your Angular project in VSCode.
2. Right-click on the root directory of your project (the directory that contains your package.json file).

3. Click on "Open in Integrated Terminal" as shown in the gif above.

4. Issue the ng serve --open command.

Copied!
ng serve --open

Make sure to right-click on the folder that contains your Angular project (the one that contains the package.json file).

I opened the root directory of my Angular project in VSCode, so I clicked directly in the left sidebar.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• How to check which version of Angular CLI is installed
• How to change the default Port number (4200) in Angular
• The Angular Compiler requires TypeScript >=4.8.2 and <4.9.0 but 4.9.3 was found instead
• Template parse errors: 'mat-icon' is not a known element
• More than one module matches. Use skip-import option to skip importing the component into the closest module
• Angular Error: Unknown argument: prod when running ng build
• The 'npm audit fix' command not working [Solved]