Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do you install angular-cli for windows 7

I am trying to install angular-cli for windows. I know the command is npm install -g angular-cli, however once I run this command I then try to do ng new however I get an error saying "ng is not a recognized command" I checked the other questions on here saying that you have to add the folder to the PATH variable, however when I check in the folder I've tried to install angular-cli into I don't even see anything.

Here you can see I've installed the angular-cli using the provided command and that any use of the "ng" command registers and error:

x

And here you can see an empty folder with no angular-cli folders or anything for that matter:

And here you can see an empty folder with no angular-cli folders or anything for that matter

PLEASE NOTE I am very new to cmd and angular and I really have no idea what steps to take here.

like image 774
tgrim90 Avatar asked Jan 23 '17 01:01

tgrim90


People also ask

Can we install Angular in Windows 7?

Use npm to install Angular CLI You will see the whole cli command to create an Angular app. You need to run the first command to install Angular CLI. These steps are same for Windows and Mac. Your Angular 7 Environment setup is complete now.


4 Answers

Installation of NodeJs, npm, TypeScript, AngularJS, @angular/cli on Windows 7 Professional SP 1 64-bit:

Since I have found many valuable hints scattered on various posts only after 'painful' search, here a compact compilation (not my ideas but my experience). Hope it helps.

  1. install Node.js Windows Installer 64-bit: https://nodejs.org/en/download/ node-v6.11.0-x64.msi

  2. If there is a (company-)proxy (installation behind firewall): configure npm against the company-proxy: open cmd window (not elevated, normally you have to be the login-user)

    npm config set proxy http://Proxy.Company.com:Port (replace Proxy.Company.com:Port with your proxy-settings)

    npm config set https-proxy http://Proxy.Company.com:Port (replace Proxy.Company.com:Port with your proxy-settings)

    Hints: Both settings are required, ask your admins for the correct url. If you need to propagate a user/password use the following syntax:

    npm config set proxy http://user:[email protected]:Port

  3. Set npm directory for packages (npm 3.10.10 comes with Node.js but we'll update it later):

    npm config set registry https://registry.npmjs.org/

  4. Update npm to the latest version:

    npm install npm@latest -g

    Beware: npm update only works with the HTTPS-variant (registry https://registry.npmjs.org/). With the HTTP-setting (see below) you earn "shasum check failed".

  5. Set npm directory for packages to the non-HTTPS-variant:

    npm config set registry http://registry.npmjs.org/

    Reason: the https-variant, which was necessary to update npm itself, does'nt work for all packages, e.g. @angular/cli@latest or angular-cli or typescript@latest either.

  6. Install TypeScript:

    npm install -g typescript@latest

  7. Possibly update Visual Studio 2015 to Update 3 (necessary) (everything also works fine with the Community Edition Update 3): Microsoft Visual Studio Professional 2015 Version 14.0.25422.01 Update 3 Microsoft .NET Framework Version 4.6.01055

  8. Ensure, that Visual Studio fetches the actually installed packages: Tools/Options, left-tree/Projects and Solutions/External Web Tools, right panel, move the $(PATH) entry to the top (above the $(DevEnvDir) entries). Afterwards close Visual Studio.

  9. Install AngularJS:

    npm install angular (my version: 1.6.5)

  10. Install Angular commandline-tool: npm install -g @angular/cli@latest (@angular/cli is the new name for angular-cli)

  11. Check versions (in cmd window; my versions below):

    node -v => v6.11.0

    npm -v => 5.1.0

    tsc -v => 2.4.1

    ng --version => 1.2.0 (@angular/cli)

  12. Install optional package installer for Visual Studio (see also section 'Links' below): https://marketplace.visualstudio.com/items?itemName=MadsKristensen.PackageInstaller (...Downloads\Package Installer v2.0.101.vsix)

If something had gone wrong, restart with the following steps:

  • In C:\Users\<User>\AppData\Roaming delete the directory 'npm'
  • In cmd window: npm cache clean or possibly: npm cache clean --force
  • run node-v6.11.0-x64.msi in repair-mode
  • continue with Item (2.).

Links:

  • https://visualstudiomagazine.com/articles/2017/04/01/set-up-aspnet-mvc.aspx
  • https://hassantariqblog.wordpress.com/2016/10/08/angular2-using-angular2-with-typescript-for-asp-net-mvc-in-visual-studio-2015/
  • https://www.codeproject.com/Articles/1164014/Kick-Start-with-AngularJS-and-Visual-Studio
  • http://www.fladi.de/2014/02/06/howto-npm-hinter-einem-proxy-verwenden/
like image 140
Erik Nagel Avatar answered Oct 05 '22 03:10

Erik Nagel


Latest versions of Node.js and Angular CLI can be setup on Windows 7 in few simple steps:

Step 1: Download Node.js

Download the latest release of Node.js from: Nodejs downloads page. I have downloaded Node.js for Windows 64-bit and the filename is: node-v8.9.3-x64.msi

Step 2: Install Node.js for Windows.

In Windows Explorer, locate the downloaded Nodejs .msi file. Double-click the .msi file. A set of screens will appear to guide you through the installation process. This will install Node.js and Node Package Manager (NPM) on your machine.

Step 3: Verify Node.js Installation

Type the following commands to check the versions of Node.js and NPM

node -v
npm -v

Step 4: Install Angular CLI

Angular Command Line Interface (CLI) is the easiest way to create new Angular projects. Execute the following NPM command to install Angular CLI:

npm install @angular/cli -g

After this installation, the CLI tool can be accessed by using ng commands.

Step 5: Verify Angular CLI

Type the command:

ng -v

I have also put all these steps in my blog: Setup Node.js and Angular CLI

like image 44
Aj Tech Developer Avatar answered Oct 05 '22 05:10

Aj Tech Developer


Please note that NG.cmd is installed normally at:

C:\Users\Administrator\AppData\Roaming\npm\ng.cmd

...where Administrator could be a user name.

like image 25
Young Avatar answered Oct 05 '22 03:10

Young


Test It!

node -v

To see if Node is installed, type the above on your command line.

npm -v

To see if npm is installed, type the above on your command line. Installing @angular/cli

npm install @angular/cli

To add this npm package to your local machine, type the above into your command line. You’ll notice a node_modules directory appear in your root where the package is now installed.

If you're having trouble installing packages, check out the helpful docs for installing npm packages locally

like image 40
Shaaban Ebrahim Avatar answered Oct 05 '22 05:10

Shaaban Ebrahim