Trailhead 官方 LWC trailmix 解读之 Quick Start: Lightning Web Components

在上面一篇 LWC 的介绍文章中推荐了官方的 trailmix Get Started with Lightning Web Components，接下来就对trailmix 中的第一个关键 trail Quick Start: Lightning Web Components 做一个梳理和解读，帮助大家能顺利迈出 LWC 辉煌旅程的第一步。

image.png

Quick Start: Lightning Web Components

很少有 trailmix 会是以一个 project 类型 trail 开头的，LWC 是。因为在你湿手前需要先搭建 LWC 的开发环境。

Unit 1：建立你的 Salesforce DX 开发环境

首先，你需要一个开发 org，而且必须是预览版的。因为LWC正式发布大约在春季。同时开发 org 需要设置 my domain。不设置并部署 domain 在页面构建页面就看不到自定义的页面组件。为了完成 trail，你还需要把这个开发org关联到你的Trailhead账户。
其次你需要Salesfroce DX工具，根据不同系统下载安装就好了。我做的过程中 SFDX 的CLI 需要升级，然后按照提示安装 sfdx plugins:install salesforcedx@pre-release 。

Unit 2：配置你的 VS Code 开发工具

下一步，你需要安装的是：vs code并安装对应插件
1,Salesforce Extension Pack。

image

2,Lightning Web Components。

image

如果你还在犹豫开发 SFDC 用什么 IDE ，真的可用省省了，一切证据都指向真相只有一个，那就是 VS CODE。学习她爱上她吧，你别无选择。

Unit 3：编写你的第一个 LWC 应用：你好，新世界百货

最后就是大串联了，用 vs code 中的 DX 插件生成LWC项目，编写项目中的 LWC 代码，用DX插件部署到之前创建好的开发ORG中。这一串弄下来，基本 Salesforce DX 也就过关了。

ok，如果顺利通过验证，恭喜你在调通整个LWC开发流程的同时还拥有了一枚闪亮的柏芝（Badge）

image.png

感受

我没做过 VF 开发，但 LWC 整套开发体验真的超棒，根本停不下来，沆瀣一气的就把这个project 做完了。从而也更坚定了我要把全部业余精力投身到 LWC 学习，培训，赚钱中去的决心。 你一起吗？不要犹豫，点击关注并送我爱心，我会在无聊的时候帮助你学 LWC 的。

过程中我遇到的小坑：

• 我做的过程中 SFDX 的CLI 需要升级，然后按照提示安装 sfdx plugins:install salesforcedx@pre-release
• 我用 VS Code 插件创建组件时 SFDC:Create Lightning xxx的时候没注意选了 Lightning Component，正确的选择应该是 Lightning Web Component。 ；）
• 我系统默认的浏览器是opera，造成在vs code中用SFDX:opent default org 的时候会拉起opera。开发谁不用 chrome 呢？这个估计要改下。
• 设置完 my domain 没有发布，所以在需要的构建页面总是提示要发布 domain 才能看到自定义的组件。

LWC 系列文章

• Salesforce 未来最有钱途的闪电（Lightning）开发组件 LWC (Lightning Web Component) 导读
• Trailhead 官方 LWC trailmix 解读之 Quick Start: Lightning Web Components
• Trailhead 官方 LWC trailmix 解读之 LWC basics
• Trailhead 官方 LWC trailmix 解读之 Set Up Your Lightning Web Components Developer Tools
• Trailhead 官方 LWC trailmix 解读之 Lightning Web Components for Aura Developers （纯净版）
• Trailhead 官方 LWC trailmix 解读之 “熊出没” APP 搭建