Mac安装Angular并部署运行应用

简介: Mac安装Angular并部署运行应用

先决条件

这里的最佳实践是在部署项目之前先在本地运行项目。要在本地运行项目,你需要在计算机上安装以下软件:

content_copynpm install -g @angular/cli
  • 借助 Angular CLI,你可以使用 ng 命令创建新的工作区、新项目、在开发过程中启动开发服务器,或生成要共享或分发的构建成果。

在本地运行你的应用

1.在左边的菜单中点击 Project 后面的 Download Project 图标,以下载你的 StackBlitz 项目源代码的 zip 包。

2.解包,并进入新创建的这个项目目录中。比如:

cd angular-ynqttp

3.使用以下 CLI 命令在本地运行你的应用:

ng serve


4.要在浏览器中查看你的应用,请访问 http://localhost:4200/。如果默认端口 4200 不可用,则可以使用端口标志指定另一个端口,如下所示:


To see your application in the browser, go to http://localhost:4200/. If the default port 4200 is not available, you can specify another port with the port flag as in the following example:


ng serve --port 4201

当启动了应用的开发服务器时,你可以编辑代码并在浏览器中查看对此更改的自动更新。要停止此 ng serve 命令,请按 Ctrl + c 键。


安装angular后,创建项目时,如果遇到timeout报错的时候,大概率是使用cnpm安装,需要重新卸载angular,重新使用npm安装。

相关文章
|
1天前
|
开发工具 开发者 git
「Mac 畅玩鸿蒙与硬件 10」鸿蒙开发环境配置篇10 - 项目实战:计数器应用
本篇将通过一个简单的计数器应用,带你体验鸿蒙开发环境的实际操作流程。本项目主要练习组件的使用、事件响应和状态管理,帮助开发者熟悉基本的应用构建流程。
26 3
「Mac 畅玩鸿蒙与硬件 10」鸿蒙开发环境配置篇10 - 项目实战:计数器应用
|
1天前
|
编解码 缓存 自然语言处理
「Mac畅玩鸿蒙与硬件8」鸿蒙开发环境配置篇8 - 应用依赖与资源管理
本篇将介绍如何在 HarmonyOS 项目中高效管理资源文件和依赖,以确保代码结构清晰并提升应用性能。资源管理涉及图片、字符串、多语言文件等,通过优化文件加载和依赖管理,可以显著提升项目的加载速度和运行效率。
19 1
「Mac畅玩鸿蒙与硬件8」鸿蒙开发环境配置篇8 - 应用依赖与资源管理
|
1天前
|
开发工具 iOS开发 开发者
「Mac畅玩鸿蒙与硬件2」鸿蒙开发环境配置篇2 - 在 Mac 上安装 DevEco Studio
本篇将专注于如何在 Mac 上安装鸿蒙开发工具 DevEco Studio,确保开发环境能够顺利搭建。完成安装后,可以正式开始鸿蒙应用的开发工作。
19 1
「Mac畅玩鸿蒙与硬件2」鸿蒙开发环境配置篇2 - 在 Mac 上安装 DevEco Studio
|
24天前
|
机器学习/深度学习 Python
【10月更文挑战第5天】「Mac上学Python 6」入门篇6 - 安装与使用Anaconda
本篇将详细介绍如何在Mac系统上安装和配置Anaconda,如何创建虚拟环境,并学习如何使用 `pip` 和 `conda` 管理Python包,直到成功运行第一个Python程序。通过本篇,您将学会如何高效地使用Anaconda创建和管理虚拟环境,并使用Python开发。
53 4
【10月更文挑战第5天】「Mac上学Python 6」入门篇6 - 安装与使用Anaconda
|
26天前
|
IDE 开发工具 iOS开发
【10月更文挑战第3天】「Mac上学Python 3」入门篇3 - 安装Python与开发环境配置
本篇将详细介绍如何在Mac系统上安装Python,并配置Python开发环境。内容涵盖Python的安装、pip包管理工具的配置与国内镜像源替换、安装与配置PyCharm开发工具,以及通过PyCharm编写并运行第一个Python程序。通过本篇的学习,用户将完成Python开发环境的搭建,为后续的Python编程工作打下基础。
157 2
【10月更文挑战第3天】「Mac上学Python 3」入门篇3 - 安装Python与开发环境配置
|
27天前
|
iOS开发 MacOS Python
【10月更文挑战第1天】「Mac上学Python 1」入门篇1 - 安装Typora与Markdown编辑技巧
本篇将详细介绍如何在Mac系统上安装Typora这款简洁高效的Markdown编辑器,并学习Markdown常用语法。通过本篇,用户能够准备好记录学习笔记的工具,并掌握基本的文档编辑与排版技巧,为后续学习提供便利。
138 1
【10月更文挑战第1天】「Mac上学Python 1」入门篇1 - 安装Typora与Markdown编辑技巧
|
10天前
|
Java 索引 Python
【10月更文挑战第19天】「Mac上学Python 30」基础篇11 - 高级循环技巧与应用
本篇将介绍更深入的循环应用与优化方法,重点放在高级技巧和场景实践。我们将讲解enumerate()与zip()的妙用、迭代器与生成器、并发循环以及性能优化技巧。这些内容将帮助您编写更高效、结构更合理的代码。
48 5
|
12天前
|
缓存 监控 JavaScript
Angular 应用打包和部署
【10月更文挑战第16天】Angular 应用的打包和部署是一个综合性的过程,需要考虑多个方面的因素。通过合理的打包和部署策略,可以确保应用在生产环境中稳定运行,并为用户提供良好的体验。你需要根据实际情况选择合适的部署方式,并不断优化和改进部署流程,以适应业务的发展和变化。
|
9天前
|
缓存 前端开发 JavaScript
前端serverless探索之组件单独部署时,利用rxjs实现业务状态与vue-react-angular等框架的响应式状态映射
本文深入探讨了如何将RxJS与Vue、React、Angular三大前端框架进行集成,通过抽象出辅助方法`useRx`和`pushPipe`,实现跨框架的状态管理。具体介绍了各框架的响应式机制,展示了如何将RxJS的Observable对象转化为框架的响应式数据,并通过示例代码演示了使用方法。此外,还讨论了全局状态源与WebComponent的部署优化,以及一些实践中的改进点。这些方法不仅简化了异步编程,还提升了代码的可读性和可维护性。
|
18天前
|
NoSQL Shell MongoDB
Mac OSX 平台安装 MongoDB
10月更文挑战第11天
17 4