一、安装 Node.js 📚
Node.js 是一个运行 JavaScript 代码的 JavaScript 运行时,它允许我们在服务器端运行 JavaScript 代码。以下是安装 Node.js 的步骤:
-
🌐 访问 Node.js 国内网站:https://nodejs.cn/
-
📦 选择 LTS(长期支持版)或 Current(最新特性版)。对于大多数用户,LTS 版本是更稳定的选择。
-
💾 下载适合你操作系统的安装程序,并按照安装向导的提示进行安装。在大多数情况下,你可以接受默认设置。
-
🔧 安装完成后,打开一个新的命令行窗口(终端),输入以下命令来验证安装:
node --version
npm --version
二、安装 Angular CLI 🛠️
Angular CLI 是官方提供的命令行工具,帮助开发者快速生成 Angular 项目和各种代码片段。
步骤:
💾 在命令行工具中运行以下命令,使用 npm 安装 Angular CLI:
-
📂 打开终端,导航到你想创建项目的位置。
-
🏗️ 在命令行工具中运行以下命令,使用 npm 安装 Angular CLI:
npm install -g @angular/cli
🔗 其中 -g 参数表示全局安装,使 CLI 在任何地方都可以使用。
- 🔍 安装完成后,运行以下命令验证是否安装成功:
ng version
📋 如果成功,您会看到 Angular CLI 的版本信息。
三、创建 Angular 项目 📚
通过 Angular CLI 可以轻松创建一个新项目。
步骤:
- 📁 在命令行中,导航到您想创建项目的目录位置,然后运行以下命令:
ng new my-angular-app
🖊️ my-angular-app 是您的项目名称,可以自定义。
- 📝 CLI 会询问一些配置选项:
- 🗺️ 选择 Yes (大多数情况下选择是)。
- 🎨 Which stylesheet format would you like to use?
- 📄 您可以选择 CSS、SCSS、Sass 或其他样式预处理器。通常,选择 SCSS 即可。
- 🔧 CLI 会自动创建项目文件夹并安装所需的依赖,这可能需要几分钟时间。
四、进入项目目录并启动开发服务器 🚀
安装完成后,进入项目目录并启动 Angular 本地开发服务器。
步骤:
- 📂 进入项目目录:
cd my-angular-app
- 💻 启动开发服务器:
ng serve
🌐 服务器启动后,打开浏览器并访问 http://localhost:4200,您应该会看到 Angular 的欢迎页面,这意味着项目创建成功,开发环境已正确配置。
参与点评
读者朋友们,如果您在阅读过程中,对文章的质量、易理解性有任何建议,欢迎在评论区指出,我会认真改进。