Create angular project in a specific version.

When we try to create a new angular project using the ng new command we get the angular project with version based on the global installed version of @angular/cli package.

So a quick fix here is to update the global @angular/cli package to latest version or which ever version you prefer so when you create a new angular project you get it with the required version.

npm uninstall -g @angular/cli
npm install -g @angular/cli@12.2.6

Using above commands we have updated our global @angular/cli version to 12.2.6. Now when you try to create a new angular project with ng new command you will get angular with version 12.2.6!!.

But what if you do not want to update the global @angular/cli version and still be able to create angular app with specific version (have your cake and eat it too). For this we can use npx command that executes npm package binaries.

First lets install npx globally.

npm install -g npx

Now we execute npx command with the -p parameter where we put a specific @angular/cli version. The last element of this statement is a command that creates an application on a specific @angular/cli version ng new [name of the project].

npx -p @angular/cli@12.2.6 ng new Angular12App

With above command we have a new angular project called Angular12App with version 12.2.0!!.

Below is the generated package.json content.

{
    "name": "angular12-app",
    "version": "0.0.0",
    "scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "watch": "ng build --watch --configuration development",
        "test": "ng test"
    },
    "private": true,
    "dependencies": {
        "@angular/animations": "~12.2.0",
        "@angular/common": "~12.2.0",
        "@angular/compiler": "~12.2.0",
        "@angular/core": "~12.2.0",
        "@angular/forms": "~12.2.0",
        "@angular/platform-browser": "~12.2.0",
        "@angular/platform-browser-dynamic": "~12.2.0",
        "@angular/router": "~12.2.0",
        "rxjs": "~6.6.0",
        "tslib": "^2.3.0",
        "zone.js": "~0.11.4"
    },
    "devDependencies": {
        "@angular-devkit/build-angular": "~12.2.6",
        "@angular/cli": "~12.2.6",
        "@angular/compiler-cli": "~12.2.0",
        "@types/jasmine": "~3.8.0",
        "@types/node": "^12.11.1",
        "jasmine-core": "~3.8.0",
        "karma": "~6.3.0",
        "karma-chrome-launcher": "~3.1.0",
        "karma-coverage": "~2.0.3",
        "karma-jasmine": "~4.0.0",
        "karma-jasmine-html-reporter": "~1.7.0",
        "prettier": "^2.4.1",
        "typescript": "~4.3.5"
    }
}

Conclusion

• We learned how to create latest angular project by updating the global @angular/cli package to required version.
• We have also learned to create latest angular project using npx.