How to Check Angular Version in 2024

There are three main methods to check your Angular version (or Angular CLI version).

The first approach involves using the ng version command (you can also use ng v for short). This command will display the version of the Angular CLI installed in your current project directory. However, if you run this command outside of an Angular project, it will show the globally installed version instead.

Another option is to use the npm list --depth 0 command. This will provide a list of all the packages installed within your current project directory. If you want to see the globally installed packages, you can add the -g (global) flag, resulting in npm list -g --depth 0.

Finally, you can also check the version information directly within your project’s package.json file. Look for the version number associated with the @angular/cli package.

Find Version with ng command

The ng version (or ng v) command is a handy tool to check your Angular version. However, where you run it matters!

1. Inside an Angular Project: Running it within an Angular project folder will display the locally installed Angular CLI version. This is the version specific to your project.
2. Outside an Angular Project: Running it outside a project folder will reveal the globally installed Angular CLI version. This is the general version available on your system.

Input:

This might give you output similar to:

Local vs. Global Versions:

There might be a scenario where your globally installed version differs from the one used by your project. Let’s say you have a project using an older Angular CLI version (e.g., 10.0.1). Running ng v inside that project folder would show the local version (10.0.1) instead of the global one.

This difference can trigger a warning message. You can disable this warning if needed.

Input:

Output:

Check Installed Packages with npm

The npm list command provides a list of packages installed within your current project directory.

To see all globally installed packages on your system, you can use the -g (or --global) flag alongside the command.

Here’s an important note: Include the --depth 0 flag when using npm list. This ensures the command only displays top-level packages, not their dependencies. If you need to delve deeper into dependency versions, use flags like --depth 1 or --depth 2.

Input:

Output:

Local version

Input:

Output:

Find Version in package.json

Another way to check your Angular version is by examining the project’s package.json file. This file lists all the dependencies your application uses, including Angular.

Here’s what you need to do:

1. Locate the package.json file within your Angular project’s directory. It’s usually at the root of your project.
2. Open the file using a text editor or code viewer.
3. Look for the section labeled devDependencies. This section lists the development dependencies required by your project.
4. Within devDependencies, find the entry for @angular/cli. This package provides the Angular CLI tools you use for development tasks.
5. Next to @angular/cli, you’ll see the specific version number currently installed in your project. This is your Angular version.

Conclusion

Version Check, Development Check! With your Angular version confirmed, ONextDigital can seamlessly integrate it into your existing project. Whether you need a custom UI/UX design (or a white-labeled solution, our team can ensure a smooth and successful development process. Contact us today.