Angular : ng serve 是如何启动应用的

最新推荐文章于 2024-03-13 14:53:20 发布
置顶 最新推荐文章于 2024-03-13 14:53:20 发布
阅读量1.8w 收藏 12
点赞数 2
分类专栏： Angular2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Edison_03/article/details/78935045
版权
如何你对Angular文件目录结构不熟悉,请出门右转,补补课.
一: 文字说明
  1. 当你在命令行中输入 ng serve 后
  2. ng 会根据 angular-cli.json 中的 main元素 找到 应用入口文件main.ts
  3. main.ts 再加载 根模块AppModule
  4. AppModule 启动Angular模块(@ngModule)
  5. @ngModule 为 AppModule 添加元数据,并指定了顶层组件AppComponent
  6. AppComponent 中我们就可以为所欲为了
二: 图解说明

这里写图片描述

北冥友余
关注
  • 2
    点赞
  • 踩
  • 12
    收藏
    觉得还不错? 一键收藏
  • 4
    评论
专栏目录
nginx启动只有master没有worker_03、云计算系列课程Nginx
weixin_39649614的博客
11-22 223
web 服务器-Nginx一. 讲在 Nginx 之前同步与异步：同步与异步的重点在消息通知的方式上，也就是调用结果的通知方式不同。同步：当一个同步调用发出去后，调用者要一直等待调用的结果通知后，才能进行后续的执行。异步：当一个异步调用发出去后，调用者不必一直等待调用结果的返回，异步调用，要想获得结果，一般有两种方式：1、主动轮询异步调用的结果;2、被调用方通过 callback(回调通...
general-angular:实时Angular AdminCRUD前端应用
05-17
一般角度的Web客户端该项目是使用版本1.0.0-beta28.3生成的。开发服务器为开发服务器运行ng serve 。... 在运行测试之前，请确保您正在通过ng serve服务该应用程序。部署到GitHub Pages 运行ng github-p
extendz-angular:扩展您的Angular应用程序
05-11
延长 该项目是使用版本1.6.0生成的。 开发服务器 为开发服务器运行ng serve 。 导航到http://localhost:4200/ 。 如果您更改任何源文件，该应用程序将自动重新加载。 代码脚手架 运行ng generate component component-name生成一个新的组件。 您还可以使用ng generate directive|pipe|service|class|guard|interface|enum|module 。 建造 运行ng build来构建项目。 构建工件将存储在dist/目录中。 使用-prod标志进行生产构建。 运行单元测试 运行ng test以通过执行单元测试。 运行端到端测试 运行ng e2e通过执行端到端测试。 进一步的帮助 要获得有关Angular CLI的更多帮助，请使用ng help或查看 。
从零开始：Angular项目的创建与运行
最新发布
彩旗工作室的博客
03-13 503
通过上述步骤，你已经成功创建并运行了你的第一个Angular应用。Angular CLI不仅让项目的创建变得简单快捷，还提供了许多命令来支持开发过程，包括生成服务、组件和模块等。随着你对Angular的进一步学习，你将能够利用这些工具和命令，更加高效地开发复杂的应用程序。欢迎进入Angular的世界，开启你的开发之旅！
Angular6学习笔记2: 启动应用
W先生
08-13 1096
在Angular4学习笔记1中，创建了一个Demo的Project，现在要启动它 一.在命令行中启动 1.切换到项目目录下： cd demo 2.启动这个应用： ng server --open --open ： 在启动后自动打开浏览器，当然也可以不加，不过在启动完成后要手动的在浏览器中输入：http://localhost:4200/ 启动完成后，会出现如下内容 此时说...
Angular —— Ng Serve Proxy让Ng Serve和你的服务器共存
KenkoTech的博客
07-28 566
NG serve proxy
安装angular/cli脚手架后，用ng serve运行项目报错、error:0308010C:digital envelope routines::unsupported
zl的博客
06-29 676
使用npm安装angular/cli脚手架后，用ng serve运行项目报错：出现这个错误是因为 node.js V17版本中最近发布的OpenSSL3.0, 而OpenSSL3.0对允许算法和密钥大小增加了严格的限制，可能会对生态系统造成一些影响.
ng serve 和 ng build 的区别
SAP 资深技术专家 Jerry Wang 的技术分享
07-13 1300
在这个文档里有介绍。 在开发过程中，你通常会使用 ng serve 命令来借助 webpack-dev-server 在本地内存中构建、监控和提供服务。但是，当你打算部署它时，就必须使用 ng build 命令来构建应用并在其它地方部署这些构建成果。 ng serve 命令，所有的操作都是在内存中进行的： ng build 和 ng serve 在构建项目之前都会清除输出文件夹，但只有 ng build 命令会把生成的构建成果写入输出输出文件夹中。 最简化的部署方式就是为开发环境构建，并把其输出复制到 W
【Angular】ng serve开服务器后通过局域网ip访问不了解决方案
向着光芒的女孩
12-15 4962
自己用局域网的ip访问自己开的服务器都不行，防火墙和代理都检查过了，又测试vue项目是可以的，查询了下angular项目要配置一下。 所在的项目配置了一下package.json文件，start命令后加入 --host 0.0.0.0发现成功了，核心代码如下： { "scripts": { "ng": "ng", "start": "ng serve --proxy-config proxy.config.json --open --host 0.0.0.0", "build.
Angular基础知识整理
qq_40843345的博客
12-06 943
angular2基础知识
使用VSCode时，执行ng serve出错
狼魂之力
09-26 843
执行 npm install -g serve 安装全局 问题描述 使用ng new hello-angular命令创建 angular 应用； 使用 VSCode 打开hello-angular应用，在终端中执行ng serve命令，报错如下： serve dist ** ** 解决办法 第一次使用 VSCode，默认使用的 powershell 执行命令，在 powershell 中禁止执行ng.ps1脚本文件。 使用 windows 的 cmd 时，可以正常执行ng serve --open命令，正常
Angular6以ng serve方式启动时指定环境方法及关联知识点
Jack汪喆的技术分享栏
07-04 9398
一.踩坑 1.问题来源 如何自定义环境并在启动时指定环境 2.解决方案 使用configuration参数启动项目，如ng serve --configuration=local or ng serve -c local启动名为local的环境 环境的定义在angular.json文件中(architect下build和serve都要添加环境配置)，如下所示 "configurations...
ng-content-driven-angular：内容驱动的Angular应用展示
02-06
开发服务器为开发服务器运行ng serve 。 导航到http://localhost:4200/ 。 如果您更改任何源文件，该应用程序将自动重新加载。代码脚手架运行ng generate component component-name生成一个新的组件。 您也可以使用...
todo-angular:使用Angular构建Todo应用程序
03-30
开发服务器为开发服务器运行ng serve 。 导航到http://localhost:4200/ 。 如果您更改任何源文件，该应用程序将自动重新加载。代码脚手架运行ng generate component component-name生成一个新的组件。 您还可以使用...
park-finder-angular：显示公园的Angular应用
02-19
Park Finder：角度一个使用Google地图显示公园的Angular应用。NgGmaps 该项目是使用版本8.0.2生成的。开发服务器为开发服务器运行ng serve 。 导航到http://localhost:4200/ 。 如果您更改任何源文件，该应用程序将...
Angular：ngFor指令
zouk‘s blogs
12-29 5049
参考：官方文档 NgFor 指令 。 ngFor指令 使用方法首先,创建自定义组件user-list（如何创建自定义组件），并为name属性初值。然后,在子组件html中引用自定义组件，并使用*ngFor指令 效果演示
Angular : 项目文件夹src目录结构及作用
zouk‘s blogs
12-29 4609
序言：如果你想入门到精通Angular，首先必须要熟悉它的文件目录结构。参考：Angular中文文档链接正文： 新建项目文件后，会出现src和非src（这里我分为2类）。 src作用：存放应用代码（组件，模板，样式等等）。 非src作用：为构建应用提供支持用。 src 非src 最后： 如果想看各个文件或者文件夹的详细说明，请看官方文档（英文，中文），这个中文文档编写的非常牛逼，看中文
Angular : 创建自定义组件
zouk‘s blogs
12-29 3425
用 ng generate hello-world 命令生成 hello-world 组件 在hello-world.component.ts中定义组件代码贴在文章末尾：代码1 在app.component.html中使用刚定义好的组件(标签)代码贴在文章末尾:代码2代码1 import { Component, OnInit } from '@angular/core';@Component({
ng serve --deploy-url
07-12
`ng serve --deploy-url` 是 Angular CLI 中的一个命令，用于启动 Angular 应用的开发服务器并指定部署 URL。 这个命令的作用是将指定的部署 URL 与应用程序的资源路径进行匹配，以确保在开发过程中正确加载资源文件。通过指定 `--deploy-url` 参数，可以将资源文件的加载路径设置为指定的 URL。 例如，如果你想将所有资源文件的加载路径设置为 `/assets`，可以使用以下命令： ``` ng serve --deploy-url=/assets ``` 这样，在启动开发服务器后，资源文件将从 `/assets` 目录加载。 希望这个回答能够帮到你！如果你有任何其他问题，请随时提问。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值