node.js 你如何在 Windows 7 上安装 Angular
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/35856152/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do you install Angular on windows 7
提问by user595985
Hi this should be pretty straight forward but I'm getting stuck. I installed buildbot (0.9.06b)on my machine a Windows 7 machine. I have managed to get it up and running however when I try to display the web page(IE8), I get the error Angular not defined. This being a brand new windows box I was not too surprised. I proceeded to download NodeJS the executable and run it on the machine so Node is installed. I then went to Angular websitedownloaded the zip file, but i'm not sure what to do next? I tried
嗨，这应该很简单，但我被卡住了。我在我的机器上安装了 buildbot (0.9.06b) 一台 Windows 7 机器。我已经设法启动并运行它，但是当我尝试显示网页（IE8）时，我收到错误 Angular 未定义。这是一个全新的 Windows 盒子，我并不感到太惊讶。我继续下载 NodeJS 可执行文件并在机器上运行它，以便安装 Node。然后我去Angular 网站下载了 zip 文件，但我不确定下一步该怎么做？我试过
npm install Angular
npm 安装 Angular
and a few variations i.e specifying the version, unzipping the file. But still cannot install it. My machine is behind a firewall so it cannot just go off to the web and get more stuff. It all has to work locally. How should I go about installing Angular? How can I check that Angular is installed?
和一些变化，即指定版本，解压缩文件。但是还是不能安装。我的机器在防火墙后面，所以它不能直接上网获取更多的东西。这一切都必须在本地工作。我应该如何安装 Angular？如何检查是否安装了 Angular？
Regards
问候
采纳答案by peteb
TL;DR
TL; 博士
Checkout this github repofor an example working app using Node, Angular, Express and Bower.
查看此 github 存储库以获取使用 Node、Angular、Express 和 Bower 的示例工作应用程序。
The you're reason receiving the Angular not defined message is because you're not serving Angular from your web server to the client.
您之所以收到 Angular 未定义消息，是因为您没有从 Web 服务器向客户端提供 Angular。
Installing Angular from npmtypically means that you're going to serve it from your node_modulesfolder or you will be using Browserify. I would advise against using npm install --save angular, your node_modulesshould contain just server-side dependencies if you're not using Browserify in most cases. Additionally, NPM packages use CommonJS, which isn't preferred in the browser. Browserify is a popular solution for writing CommonJS style code that can be bundled into a browser compatible js file. They have docsto get up and running with.
从安装 Angularnpm通常意味着您将从您的node_modules文件夹中提供它，或者您将使用Browserify。我建议不要使用npm install --save angular，node_modules如果您在大多数情况下不使用 Browserify ，您应该只包含服务器端依赖项。此外，NPM 包使用 CommonJS，这在浏览器中不是首选。Browserify 是一种流行的编写 CommonJS 风格代码的解决方案，可以捆绑到浏览器兼容的 js 文件中。他们有文档可以启动和运行。
Alternatively you can install Angular from Bower.io. Bower is a package manager for client-side packages. Bower has a huge package library, including many of the packages that are also available through NPM.
或者，您可以从Bower.io安装 Angular 。Bower 是客户端包的包管理器。Bower 有一个巨大的包库，包括许多也可以通过 NPM 获得的包。
Its also worth mentioning that unless you're doing a npm install -gfor global installs, you should add the --saveflag when doing an npm installor an npm uninstallfor your project dependencies. --saveadds any packages you've installed to your package.jsonfile as dependency.
还值得一提的是，除非您npm install -g为全局安装做 a，否则您应该在为您的项目依赖项--save做 annpm install或 an时添加标志npm uninstall。--save将您安装的任何软件包package.json作为依赖项添加到您的文件中。
Here is an example of how to serve Angular from Node.js
这是如何从 Node.js 提供 Angular 的示例
This example just uses Node.js, Express, EJS (for Express View Engine Rendering), Bower & Angular
此示例仅使用 Node.js、Express、EJS（用于 Express 视图引擎渲染）、Bower 和 Angular
npm install -g bower
cd <your project directory>
// answer questions about your project
// this will create your package.json file
npm init
npm install --save express
npm install --save ejs
// answer the questions about your project
// this will create your bower.json file
bower init
bower install --save angular
Directory Structure
目录结构
- Project Folder
- node_modules
- bower_components
- public
- app
- app.js
- views
- index.html
- bower.json
- package.json
- server.js
The Angular App - public/app/app.js
Angular 应用程序 - public/app/app.js
// This is a super simple Hello World AngularJS App
(function() {
angular
.module('yourApp', [])
.controller('YourController', ['$scope', function($scope) {
$scope.hello = 'Hello World';
}]);
})();
Angular must be loaded just like any other Client-Side library, so it will need to be included in your pages within the <head>tag.
Angular 必须像任何其他客户端库一样加载，因此它需要包含在您的页面中的<head>标签内。
The View - views/index.html
视图 - views/index.html
<html>
<head>
<!-- load Angular into our HTML Page -->
<script src="/bower_components/angular/angular.js"></script>
<!-- load our Angular App in -->
<script src="/public/app/app.js"></script>
</head>
<body ng-app="yourApp">
<div ng-controller="YourController">
{{ hello }}
</div>
</body>
</html>
In order for this to work you will need to actually have a web server running that will serve the files you're looking for when you call them. You can do this using Express.
为了使其工作，您实际上需要运行一个 Web 服务器，该服务器将在您调用它们时为您查找的文件提供服务。您可以使用Express执行此操作。
The Node.js Web Server - server.js
Node.js Web 服务器 - server.js
var express = require('express);
var path = require('path');
var app = express();
// Setup View Engines
app.set('views', path.join(__dirname, 'views'));
app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
// Serve files from your "public" directory
app.use('/public', express.static(path.join(__dirname + 'public)));
// Serve files from your "bower_components" directory
app.use('/bower_components', express.static(path.join(__dirname + '/bower_components')));
// GET index.html route
app.get('/', function(req, res) {
return res.render('index');
});
// Start our server and start to listen
app.listen(process.env.PORT || 3000, function() {
console.log('listening');
});
Now all you need to do is node server.jsand visit your site at localhostor wherever you've specified and you should be up and running.
现在您需要做的就是在您指定的node server.js位置localhost或任何地方访问您的站点，并且您应该已启动并运行。
回答by Sapna
You can easily install angular using these steps-
您可以使用以下步骤轻松安装 angular-
1> Angular requires Node.js version 8.x or 10.x.,Check node.js version by-
1> Angular 需要 Node.js 版本 8.x 或 10.x.，检查 node.js 版本 -
node -v
2>Install node.js,go to nodejs.org.
2> 安装 node.js，转到nodejs.org。
3>Install npm-
3>安装npm-
npm install -g @angular/cli
4>Create a project-
4>创建一个项目-
ng new my-app
here my-app is project name
这里 my-app 是项目名称
5> Would you like to add Angular routing? No
5> 是否要添加 Angular 路由？不
6> Which stylesheet format would you like to use? CSS
6> 您想使用哪种样式表格式？CSS
7> Go to the workspace folder
7> 进入工作区文件夹
cd my-app
8> Launch the server by using the CLI command ng serve, with the --open option.
8> 使用 CLI 命令 ng serve 和 --open 选项启动服务器。
ng serve --open
9> opens your browser to http://localhost:4200/.
9> 打开浏览器访问http://localhost:4200/。
