Command not available when running Angular CLI outside workspace

Total
0
Shares

Run commands from root path of your project in terminal to resolve “Error: This command is not available when running the Angular CLI from outside the workspace“.

What is project root path of Angular?

The directory structure of an Angular project is something like this –

Project_Root_Folder
 |- .angular
 |- .dist
 |- dist
 |- node_modules
 |_ src
 |   |_ app
 |- .angular-cli.json
 |_ package.json

The highest level of project directory is the root directory. Generally, it has node_modules folder in it.

Solution

The solution to the error: command not available outside Angular cli workspace is to run commands like ng serve --open or ng serve from the root path of the project.

For example, in the directory structure above, out root folder is Project_Root_Folder. We need to enter into it –

cd /path/to/Project_Root_Folder

Then, we can run our commands –

/path/to/Project_Root_Folder> ng serve --open 

Use Integrated Terminal in VSCode

If you are using VSCode, then it’s a good practice to use integrated terminal. Follow these steps –

  1. Right click on the root folder.
  2. Select Open in Integrated Terminal

Check angular.json or package.json files

Sometimes the configuration files like angular.json or package.json get’s corrupted due to some invalid entry. Check if the syntax as well as formatting in both of these files are correct.

Conclusion

A workspace in angular project is the directory structure from root folder. When we run some commands, it is expected that we will run them from root path. This is because the long commands are stored in package.json file and we use the short version. All the paths of different files are referenced from root. If we are outside our workspace then Angular CLI will throw error like command not available.