你如何为 Windows 7 安装 angular-cli

Posted

技术标签:

【中文标题】你如何为 Windows 7 安装 angular-cli【英文标题】：How do you install angular-cli for windows 7 【发布时间】：2017-06-07 11:26:04 【问题描述】：

我正在尝试为 Windows 安装 angular-cli。我知道命令是 npm install -g angular-cli，但是一旦我运行此命令，我就会尝试执行 ng new 但是我收到错误消息“ng 不是一个可识别的命令”我检查了这里的其他问题说你必须将文件夹添加到 PATH 变量中，但是当我签入文件夹时，我尝试将 angular-cli 安装到其中，我什至什么都没看到。

在这里你可以看到我已经使用提供的命令安装了 angular-cli，并且任何使用“ng”命令都会注册和错误：

在这里您可以看到一个没有 angular-cli 文件夹或任何相关内容的空文件夹：

请注意我对 cmd 和 angular 很陌生，我真的不知道在这里采取什么步骤。

【问题讨论】：

你重启你的cmd实例了吗？ @DanielA.White 如果你的意思是我关闭 cmd 并尝试再次运行 ng new test-app 是的，我已经尝试过了。 在您的情况下，您的 angular-cli 全局 npm 安装位于 'C:\Users\Owner\AppData\Roaming\npm\node_modules\angular-cli' （您可以通过运行 ' npm root -g' 命令）。因此，尝试将其 bin 文件夹（ng 可执行文件所在的位置）添加到 PATH 变量中 @Andriy 这是我的路径变量 C:\Users\Owner\AppData\Local\atom\bin;C:\Users\Owner\AppData\Roaming\npm\node_modules \angular-cli\bin; 我添加了 bin 文件夹，但仍然无法识别 ng。 奇怪，尝试使用完整路径运行它：C:\Users\Owner\AppData‌​\Roaming\npm\node_mo‌​dules\angular-cli\bi‌​n\ng new test-app，并重新启动您的 cmd 实例 【参考方案1】：

使用此命令安装最新版本

npm i @angular/cli @latest

【讨论】：

【参考方案2】：

第 1 步：下载 Node.js

从以下位置下载最新版本的 Node.js：Nodejs 下载页面。我已经下载了适用于 Windows 64 位的 Node.js，文件名是：node-v8.9.3-x64.msi

第 2 步：安装适用于 Windows 的 Node.js。

在 Windows 资源管理器中，找到下载的 Nodejs .msi 文件。双击 .msi 文件。将出现一组屏幕来指导您完成安装过程。这将在您的机器上安装 Node.js 和 Node Package Manager (NPM)。

第 3 步：验证 Node.js 安装

键入以下命令以检查 Node.js 和 NPM 的版本

节点-v npm -v

第 4 步：安装 Angular CLI

Angular 命令行界面 (CLI) 是创建新 Angular 项目的最简单方法。执行以下 NPM 命令来安装 Angular CLI： 第 1 步：下载 Node.js

从以下位置下载最新版本的 Node.js：Nodejs 下载页面。我已经下载了适用于 Windows 64 位的 Node.js，文件名是：node-v8.9.3-x64.msi

第 2 步：安装适用于 Windows 的 Node.js。

在 Windows 资源管理器中，找到下载的 Nodejs .msi 文件。双击 .msi 文件。将出现一组屏幕来指导您完成安装过程。这将在您的机器上安装 Node.js 和 Node Package Manager (NPM)。

第 3 步：验证 Node.js 安装

键入以下命令以检查 Node.js 和 NPM 的版本

节点-v npm -v

第 4 步：安装 Angular CLI 此命令将安装最新版本的 Angular 命令行。

npm i -g @angular/cli

【讨论】：

【参考方案3】：

请注意NG.cmd正常安装在：

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

...Administrator 可以是用户名。

【讨论】：

【参考方案4】：

只需几个简单的步骤，即可在 Windows 7 上设置最新版本的 Node.js 和 Angular CLI：

第 1 步：下载 Node.js

从Nodejs downloads page 下载最新版本的 Node.js。我已经下载了适用于 Windows 64 位的 Node.js，文件名是：node-v8.9.3-x64.msi

第 2 步：安装适用于 Windows 的 Node.js。

在 Windows 资源管理器中，找到下载的 Nodejs .msi 文件。双击 .msi 文件。将出现一组屏幕来指导您完成安装过程。这将在您的机器上安装 Node.js 和 Node Package Manager (NPM)。

第 3 步：验证 Node.js 安装

键入以下命令以检查 Node.js 和 NPM 的版本

node -v
npm -v

第 4 步：安装 Angular CLI

Angular 命令行界面 (CLI) 是创建新 Angular 项目的最简单方法。执行以下 NPM 命令安装 Angular CLI：

npm install @angular/cli -g

安装完成后，可以使用 ng 命令访问 CLI 工具。

第 5 步：验证 Angular CLI

输入命令：

ng -v

我也将所有这些步骤都放在了我的博客中：Setup Node.js and Angular CLI

【讨论】：

如果你在代理后面运行，你可以关注这个教程jjasonclark.com/how-to-setup-node-behind-web-proxy 安装 cli 给了我很多错误，但最后 npm install @angular/cli -g 工作了！..谢谢【参考方案5】：

测试一下！

node -v

要查看是否安装了 Node，请在命令行中输入上述内容。

npm -v

要查看是否安装了 npm，请在命令行中输入上述内容。 安装@angular/cli

npm install @angular/cli

要将此 npm 包添加到本地计算机，请在命令行中键入上述内容。你会注意到一个 node_modules 目录出现在你的根目录中，现在安装了包。

如果您在安装包时遇到问题，请查看有关在本地安装 npm 包的有用文档

【讨论】：

【参考方案6】：

在 Windows 7 Professional SP 1 64 位上安装 NodeJs、npm、TypeScript、AngularJS、@angular/cli：

因为我发现许多有价值的提示仅散布在各种帖子中 在“痛苦”搜索之后，这里有一个紧凑的编译 （不是我的想法，而是我的经验）。希望对您有所帮助。

    安装 Node.js Windows 安装程序 64 位： https://nodejs.org/en/download/ 节点-v6.11.0-x64.msi

    如果有（公司）代理（安装在防火墙后面）： 针对公司代理配置 npm： 打开 cmd 窗口（不提升，通常你必须是登录用户）

    npm config set proxy http://Proxy.Company.com:Port（将 Proxy.Company.com:Port 替换为您的代理设置）

    npm config set https-proxy http://Proxy.Company.com:Port（将 Proxy.Company.com:Port 替换为您的代理设置）

    提示：这两项设置都是必需的，请向您的管理员询问正确的设置 网址。 如果您需要传播用户/密码，请使用以下语法：

    npm 配置设置代理http://user:pass@Proxy.Company.com:Port

    为包设置 npm 目录 （npm 3.10.10 带有 Node.js，但我们稍后会更新它）：

    npm 配置设置注册表https://registry.npmjs.org/

    更新 npm 到最新版本：

    npm install npm@latest -g

    注意：npm update 仅适用于 HTTPS 变体 （注册https://registry.npmjs.org/）。 使用 HTTP 设置（见下文），您将获得“shasum check failed”。

    将包的 npm 目录设置为非 HTTPS 变体：

    npm 配置设置注册表http://registry.npmjs.org/

    原因：https 变体，这是更新 npm 本身所必需的， 不适用于所有软件包，例如@angular/cli@latest 或 angular-cli 或 typescript@latest。

    安装 TypeScript：

    npm install -g typescript@latest

    可能将 Visual Studio 2015 更新到更新 3（必需） （社区版更新 3 也一切正常）： 微软视觉工作室专业版 2015 版本 14.0.25422.01 更新 3 Microsoft .NET 框架版本 4.6.01055

    确保 Visual Studio 获取实际安装的包： 工具/选项，左树/项目和解决方案/外部网络工具， 右侧面板，将 $(PATH) 条目移动到顶部 （在 $(DevEnvDir) 条目上方）。然后关闭 Visual Studio。

    安装 AngularJS：

    npm install angular（我的版本：1.6.5）

    安装 Angular 命令行工具： npm install -g @angular/cli@latest（@angular/cli 是 angular-cli 的新名称）

    检查版本（在 cmd 窗口中；我的版本如下）：

    node -v => v6.11.0

    npm -v => 5.1.0

    tsc -v => 2.4.1

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

    为 Visual Studio 安装可选包安装​​程序 （另请参阅下面的“链接”部分）： https://marketplace.visualstudio.com/items?itemName=MadsKristensen.PackageInstaller (...Downloads\Package Installer v2.0.101.vsix)

如果出现问题，请按照以下步骤重新启动：

在 C:\Users\\AppData\Roaming 中删除目录 'npm' 在 cmd 窗口中：npm cache clean 或者可能：npm cache clean --force 在修复模式下运行 node-v6.11.0-x64.msi 继续第 (2.) 项。

链接：

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/

【讨论】：

以上是关于你如何为 Windows 7 安装 angular-cli的主要内容，如果未能解决你的问题，请参考以下文章

教你如何为 Mac 版 Chrome 增加启动参数

如何为 Angular 7 项目设置 sonarqube

你如何为 getInitialProps 编写 Jest 测试？

你如何为 iPhone 实现横向启动屏幕？

你如何为 IE 开发插件？

你如何为 UIImagePickerController 的导航栏着色/自定义？