如何在 windows 上安装 Angular 7

Question

您好，这应该很简单，但我被卡住了。我在 Windows 7 机器上安装了 buildbot (0.9.06b)。我已经设法启动并运行ning 但是当我尝试显示网页 (IE8) 时，我收到错误 Angular 未定义。这是一个全新的 windows 盒子，我并不太惊讶。我继续下载 NodeJS 可执行文件并将其运行安装在机器上，以便安装 Node。然后我去 Angular website 下载了 zip 文件，但我不确定下一步该做什么？我试过了

npm install Angular

和一些变体，即指定版本、解压缩文件。但是还是不能安装。我的机器在防火墙后面，所以它不能直接访问网络并获取更多内容。这一切都必须在当地运作。我应该如何安装 Angular？如何检查 Angular 是否已安装？

此致

Answer 1

TL;DR

查看 this github repo 使用 Node、Angular、Express 和 Bower 的示例工作应用程序。

您收到 Angular 未定义消息的原因是您没有从 Web 服务器向客户端提供 Angular 服务。

从 npm 安装 Angular 通常意味着您将从 node_modules 文件夹提供它，或者您将使用 Browserify. I would advise against using npm install --save angular, your node_modules should 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 docs 启动和运行。

或者，您可以从 Bower.io. Bower is a package manager for client-side packages. Bower has a huge package library 安装 Angular，包括许多也可通过 NPM 获得的软件包。

还值得一提的是，除非您为全局安装执行 npm install -g，否则在执行 npm install 或 npm uninstall 时应添加 --save 标志为您的项目依赖。 --save 将您安装的任何包作为依赖项添加到 package.json 文件中。

这是一个如何从 Node.js

服务 Angular 的示例

此示例仅使用 Node.js、Express、EJS（用于 Express View 引擎渲染）、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

目录结构

- Project Folder
  - node_modules
  - bower_components
  - public
    - app
      - app.js
  - views
    - index.html
  - bower.json
  - package.json
  - server.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 必须像任何其他客户端库一样加载，因此需要将其包含在您的页面中的 <head> 标记内。

风景 - 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>

为了使其正常工作，您实际上需要有一个 Web 服务器运行，当您调用它们时，它会提供您要查找的文件。您可以使用 Express.

执行此操作

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');
});

现在您需要做的就是 node server.js 并在 localhost 或您指定的任何地方访问您的网站，您应该起床运行。

Answer 2

您可以使用这些步骤轻松安装 angular-

1> Angular 需要 Node.js 版本 8.x 或 10.x.,通过-

检查 node.js 版本

node -v

2>安装 node.js，转到 nodejs.org。

3>安装 npm-

npm install -g @angular/cli

4>创建项目-

ng new my-app

here my-app is project name

5> 要添加 Angular 路由吗？否

6> 您想使用哪种样式表格式？ CSS

7> 转到工作区文件夹

cd my-app

8> 使用带有 --open 选项的 CLI 命令 ng serve 启动服务器。

ng serve --open

9> 打开浏览器 http://localhost:4200/。

如何在 windows 上安装 Angular 7

How do you install Angular on windows 7

windows

buildbot

node.js

angularjs

TL;DR

这是一个如何从 Node.js