Skip to main content

分析您的代码并将其部署到您的组织

学习目标

在此项目中,您将:

  • 安装推荐的开发人员工具以创建和使用 Lightning Web 组件。
  • 创建 Lightning Web 组件。
  • 使用提供的开发人员工具修复代码中的错误。
  • 配置记录布局以显示您的 Lightning Web 组件。
备注

备注

用中文(简体)学习?在此徽章中,Trailhead 实践挑战验证使用英文。括号中提供了译文,用作参考。在您的 Trailhead playground 中,您需确保 (1) 将区域设置切换为美国,(2) 将语言切换为英语,(3) 仅复制粘贴英文值。按此处说明进行。

查看 Trailhead 本地化语言徽章详细了解如何利用 Trailhead 译文。

您已学习此全新的编程模型,名为 Lightning Web 组件,现在您想要开始构建您自己的 Web 组件。首先,您需要一些工具。就像您需要一把锤子才能把钉子钉进木梁上一样(除非您有超强的力量,不用锤子也能做到这一点),您需要工具来编写 Lightning Web 组件。 

虽然您可以使用任何文本编辑器创建 Lightning Web 组件,但您将无法获得一组专用工具提供的舒适和支持。如果您是一位经验丰富的 Salesforce 开发人员,希望将 Lightning Web 组件整合到您的应用程序中,那么如果您将一些新工具整合到您的工具链中,您将更加成功。如果您不熟悉 Salesforce 开发并希望开始构建 Lightning Web 组件,您会想要熟悉用于处理 Salesforce 项目的正确工具链。

由于 Lightning Web 组件是基于现代 web 标准,因此相关工具建立在当前 Web 开发人员中流行的工具之上是合乎逻辑的。

创建新的 Trailhead Playground

对于该项目,您需要创建新的 Trailhead Playground。滚动到此页面的底部,单击 Playground 名称,然后单击 Create Playground(创建 Playground)。创建新的 Trailhead Playground 通常需要 3 到 4 分钟。

注意:是的,确实是指一个全新的 Trailhead Playground!如果您使用现有的组织或 Playground,则在完成此项目中的步骤时可能会遇到问题。

Salesforce CLI

与许多其他编程语言和模型一样,Salesforce 包含一个命令行界面 (CLI)。如果您曾经使用过 npm、yarn、gradle 或 maven,那么 Salesforce CLI 对您来说将很好熟悉—刚好是为 Salesforce 开发任务量身定制的(如果这些首字母缩略词对您来说看起来像缩写词的大杂烩,那也没关系)。

Salesforce CLI 允许您以多种方式与 Salesforce 环境进行交互,例如检索或推送代码或与数据交互。CLI 由几个插件组成。这些插件提供重要的特定功能。例如 plugin-org 插件提供了管理 Salesforce 组织的功能,例如创建临时组织。

注意

有趣的事实:Salesforce CLI 100% 开源。您可以查看所有的源代码,如果您愿意,甚至可以贡献新的功能。查看 Salesforce CLI 状态页了解包含的插件及其存储库。 

安装

如果您已经安装了 Salesforce CLI,您可以跳过这部分。请遵循以下步骤或参阅 Salesforce CLI 设置指南查看安装说明。

  1. 通过 https://developer.salesforce.com/tools/salesforcecli 安装 CLI。
  2. 通过在命令行中运行以下命令确认已正确安装最新版本的 CLI:sf update
  3. 您应该看到类似以下的输出:@salesforce/cli:Updating CLI…(@salesforce/cli:正在更新 CLI..)

您的 Salesforce CLI 已经准备好了!很简单,是不是?现在,作为新的 Lightning Web 组件开发人员,我们继续工具箱中的下一个工具,IDE。

Visual Studio Code

Visual Studio Code 是 Salesforce 开发人员的首选代码编辑器。它是免费的,开源的,可用于 Windows、Linux 和 macOS。Visual Studio Code 在 Web 开发人员中是一个完善的 IDE。现在,它也是构建 Lightning Web 组件的有效 IDE,Salesforce 为 Visual Studio Code 提供免费扩展,可进一步简化您的开发体验。

按照这些说明安装 Visual Studio Code。 

  1. 下载并安装适合您的操作系统的最新版 Visual Studio Code。如果您已经安装了 Visual Studio Code,无需重新安装。
  2. 启动 Visual Studio Code。
  3. 点击侧栏中的扩展程序 ()。
  4. 搜索 Salesforce Extension Pack,然后单击 Install(安装)。如果已安装,则只需单击 Reload(重新加载)按钮。

    Visual Studio Code 的 Salesforce Extension Pack 搜索。 

  5. macOS 系统中按 Command + Shift + P,Windows 或 Linux 按 Ctrl + Shift + P 显示命令面板。在命令面板中,键入 sfdx 显示可用命令的初始列表。

完成!您已安装开发第一个 Lightning Web 组件所需的所有工具。

我们还提供 Salesforce Extension Pack。Extension Pack 为在 Lightning Platform 上进行开发提供了出色的工具,并包括用于使用 Apex、Visualforce 甚至 Replay Debugger 的工具。 

激活开发人员中心

对于此项目,您将 Trailhead Playground 用作开发人员中心,并在临时组织中创建 Lightning Web 组件。但首先让我们解释一下什么是开发人员中心和临时组织。

临时组织是一个专用的、可配置的短期 Salesforce 环境,您可以在启动新项目、新功能分支或功能测试时快速启动该环境。

开发人员中心 (Dev Hub) 是您和您的团队用来创建和管理临时组织的主要 Salesforce 组织。

注意

在组织中启用 Dev Hub 后,您将无法禁用。

  1. 启动您的 Trailhead Playground
  2. 单击设置 设置 选择 Setup(设置)
  3. 在 Setup(设置)中的 Quick Find(快速查找)框中输入 Dev Hub,然后选择 Dev Hub。
  4. 单击滑块以启用 Dev Hub。

就是这么简单。您已通过启用 Lightning Web 组件设置了 Dev Hub,您已下载、安装和配置您需要的工具。在下一步中,您使用这些工具创建您的第一个 Lightning Web 组件。

继续免费学习!
注册帐户以继续。
有什么适合您的内容?
  • 为您的职业目标获取个性化推荐
  • 通过实践挑战和测验练习您的技能
  • 跟踪并与雇主分享您的进度
  • 与人联系以获取指导和就业机会