Salesforce LWC学习(一)Salesforce DX配置

LWC: Create a Salesforce DX Project and Lightning Web Component：https://www.youtube.com/watch?v=p268YjunARA&feature=youtu.be

Build App with Package Development：https://trailhead.salesforce.com/en/content/learn/trails/sfdx_get_started

Salesforce DX(Developer Experience) Develop Guide: https://resources.docs.salesforce.com/220/latest/en-us/sfdc/pdf/sfdx_dev.pdf

Salesforce CLI Command Reference：https://resources.docs.salesforce.com/220/latest/en-us/sfdc/pdf/sfdx_cli_reference.pdf

邵悦老师的Salesforce DX视频分享：https://mubu.com/doc/ACZ7LXEIG （里面对不少概念进行了详细的描述，能够优先看这个里面的视频）

 最开始作salesforce开发时使用eclipse，后来由于太笨重以及不太方便因此改用了sublime + haoide。sublime + haoide不管是作classic仍是使用aura 开发lightning都很爽，并且轻便型以及强大的功能更让人欲罢不能。由于salesforce推出LWC须要使用salesforce DX，因此后期学习以及项目开发尝试的去了解和使用Visual Studio Code + salesforce DX进行操做。那么Visual Studio Code + salesforce DX如何实现salesforce开发，主要有如下几个步骤。

PreRequirement

1. Enable Dev Hub：经过下面截图能够看出来，Enable Dev Hub有如下的好处：

• 能够经过command line去建立和管理 scratch org;
• 能够在请求过的scratch org中查看相关信息，包括他们是否active、delete、expired；
• 当使用带有命名空间的scratch org 的Dev Hub状况下，你能够关联namespace org到此 Dev Hub.

当你使用的是trail或者开发版本的org，须要考虑如下点：

• 天天最多能够建立6个stratch org,其中最多能够有3个active状态的stratch org;
• 你能够在开发版本的org定义一个命名空间若是这个开发版本org不是你的Dev Hub，你也能够在在开发环境启用Dev Hub若是这个开发版本org不包含namespace

 当咱们启用了Dev Hub就意味着咱们能够经过stratch org进行开发，由于项目开发不多是一我的独立完成的，会有一个团队成员去进行开发。系统管理员这个profile默承认以访问Dev Hub从而建立stratch org，针对非system admin的帐号，咱们能够经过建立permission set并assign给指定用户从而容许他访问Dev Hub并建立stratch org. 建立Permission Set须要有如下配置信息：

• Object Settings > Scratch Org Infos > Read, Create, Edit, and Delete
• Object Settings > Active Scratch Orgs > Read, Edit, and Delete
•  Object Settings > Namespace Registries > Read

若是想在Dev Hub中使用second-generation包，则还须要下面的配置：

• System Permissions > Create and Update Second-Generation Packages

这个配置可让咱们在CLI Command里面访问：force:package:create / force:package:version:create / force:package:version:update

一. 下载安装CLI(windows64为例)

 CLI全称为 Command Line Interface，用于控制Salesforce应用程序的整个应用程序生命周期。使用它，能够轻松地针对开发和测试建立环境，在你的scratch org和VCS(Version Control System，此处推荐GitHub)之间同步源代码，并执行测试。下载地址为： https://sfdc.co/sfdx_cli_win64 

下载后按照步骤安装，能够用command来测试是否成功。输入sfdx，若是显示如下内容则安装成功。

salesforcedx插件在version45.5.0及之前须要须要 Salesforce CLI v6, 在version45.8.0及之后须要Salesforce CLI v7及之后。当咱们安装CLI时，默认系统会安装最新的salesforcedx的插件，咱们若是想要知道当前当前咱们安装的CLI 版本以及对应的插件版本状况下，咱们能够在command line里面执行sfdx plugins --core即可以看到。若是咱们想要安装指定的版本的插件，咱们能够运行sfdx plugins:install someversion，好比安装45.8.0咱们就能够写：sfdx plugins:install salesforcedx@45.8.0

若是想要安装最新的salesforcedx CLI 版本，执行sfdx update便可

 

 想要了解更多的Command命令能够参看：https://resources.docs.salesforce.com/220/latest/en-us/sfdc/pdf/sfdx_cli_reference.pdf

使用CLI进行salesforce DX开发主要有如下步骤：

1. 在本地建立一个 salesforce DX Project

有三种方式能够建立salesforce DX project，取决于你项目如何开始。

1) 经过VCS(此处为GitHub)建立一个salesforce DX project：官方提供了一个sample的git地址：git clone https://github.com/forcedotcom/sfdx-simple.git，先在电脑里面安装git的安装包，安装之后命令行中执行此内容则会在目录下生成sfdx-simple文件目录。git for windows地址以下：https://gitforwindows.org/

生成的目录格式以下，文件中的各个含义后续会讲。

2）建立一个全新的salesforce DX project:主要分红两步实现

　　-->1：切换到想要存储这个新的salesforce DX项目的路径，这里以My_Standard_DX目录为例

 　   -->2：使用sfdx中的指令force:project:create指令去建立一个新的salesforce DX,指令中会生成两种类型的salesforce DX 项目对应的文件目录，两个值 ： template empty/ template standard

empty 写法以下：sfdx force:project:create --projectname sampleDXProject --template empty <==> sfdx force:project:create -- projectname sampleDXProject
template empty会生成如下的文件：

• config/project-scratch-def.json：Scratch Org配置文件，当Scratch Org建立时，会以这个做为模板进行配置。
• .forceignore：当进行convert操做时，cli会忽略'.'开头的文件，想要在convert时排除更多文件，能够在此文件中进行配置；当进行scratch org以及project之间同步时，能够在此文件中配置不想同步的component。
• README.md
• sfdx-project.json：标识了此项目是一个salesforce DX项目，配置文件中包含了项目的信息以及便于scratch org进行身份认证和二次生成包的建立，也告诉了当在project和scratch org之间同步时，CLI在哪里放文件。
• force-app/main/default/aura
• force-app/main/default/lwc

其中，force-app用来放lightning中aura以及lwc的文件的，默认名称为force-app，若是咱们想更改这个目录名称，能够default package名字：
例如，将这个而修改为 sfdx_package sfdx force:project:create --projectname sampleDXProject --defaultpackagedir sfdx_package

standard写法以下：sfdx force:project:create --project sampleDXProject1 --template standard

template standard 除了empty文件之外还会生成如下文件：

• gitignore ： 针对使用Git实现 VCS 更容易
• prettierrc and .prettierignore: 针对Aura component会更漂亮的格式化
• .vscode/extensions.json: 当visual studio code启动时，会针对你的项目建议你安装相关的扩展插件
• .vscode/launch.json: 配置Replay Debugger，使它更容易发现和使用
• .vscode/settings.json: 默认的状况下，这个文件有一个设置，用于保存操做时push或者deploy，默认值是false，能够在文件中改变值或者增长配置

这个默认也会生成force-app目录，若是想要修改的话，可使用 defaultpackagedir在 template standard后面

3) 在已有的项目上建立salesforce DX project.当咱们项目中已经有一些代码了，想要使用salesforce DX，须要先将source code处理到本地而且转化成source format格式。这里常见有两种方式的对已经存在项目中的metadata源进行处理。

　　-->1 针对managed package进行检索metadata源：

　　这里咱们在dev环境建立了一个package名字为 TestPackage，里面放了一个App的component，咱们能够经过如下的命令行来将metadata源导入到本地

　　首先在本地建立目录用来做为salesforce DX project的目录，这里demo用mdapipkg：mkdir mdapipkg

　　最后使用sfdx force:mdapi:retrieve -s -r ./mdapipkg -u <username> -p <package name> 指令来导入metadata源到本地。其中username为你的这个package对应的org的username，package name对应的是managed package的包名，若是包名包括空格，则使用''放在里面

生成的文件是zip文件，咱们只要解压到本地文件夹，而后删除zip文件便可。

 　　-->2：针对package.xml这种Manifest文件进行解析：咱们使用sublime或者使用eclipse时，当咱们download源代码时，会根据package.xml里面的内容进行检索以及down到本地，若是针对package.xml不知道如何组成的以及里面的配置信息写的，能够移步：https://developer.salesforce.com/docs/atlas.en-us.220.0.api_meta.meta/api_meta/manifest_samples.htm。咱们在demo中将 package放在salesforce_dx_with_package目录下，可使用如下的命令行经过metadata 将 metadata 源检索到本地：sfdx force:mdapi:retrieve -r ./mdapipkg -u <username> -k ./package.xml 。其中username对应的是你这个xml对应的环境的username，后者package.xml建议使用绝对路径。

 2. Dev Hub Authorization

咱们最终的进行开发是在scratch环境进行，当咱们在本地环境建立好salesforce DX项目之后，须要先经过Dev Hub受权之后才能够建立以及管理Scratch Org。Dev Hub受权能够有多种方式，这里使用基于Web-Base Flow实现。须要注意的是，你只能受权一个org一次，当咱们在开发中须要进行org之间的切换，咱们须要为这个org指定用户名，能够经过--targetusername 或者--targetdevhubusername来设置一个默认的username或者别名。在受权之前，咱们须要一个 connected app,salesforce默认提供了一个connected app进行使用，若是须要更多的安全相关的控制好比IP range等，能够本身建立connected app设置权限，感兴趣的能够自行查看，这里使用默认的方式进行受权。

咱们可使用sfdx force:auth:web:login命令行来实现受权登录，若是你受权的是一个Dev Hub org，能够setdefaultdevhubusername来设置当前的Dev Hub为你的默认的环境，好比：sfdx force:auth:web:login --setdefaultdevhubusername --setalias my-hub-org。须要注意的是，setdefaultdevhubusername只能用于受权Dev Hub org，针对sandbox，不可使用此parameter。当输入完指令回车之后，会跳转salesforce登录页面，输入dev hub org的帐号密码后，便会受权成功。

经过下面的截图能够看到，咱们目前有两个链接的dev hub环境，下面的有D的标识意思为Default dev hub，而且别名修改为了 my-hub-org。

 固然，咱们也能够基于安全性对dev hub进行取消受权，使用force:auth:logout标签便可取消受权。

 3. Scratch Org建立，配置、source data的push/pull以及登录

前面也屡次提到了Scratch Org，由于DX是基于source-driven的设计，因此Scratch Org咱们能够按照英文翻译理解，用后就能够扔掉的org。当咱们受权了Dev Hub之后，咱们即可以进行Scratch Org的建立。不一样的开发人员可能会针对不一样的开发需求，因此Scratch Org是彻底的可配置的，针对不一样的Scratch Org能够容许开发人员有不一样的配置特性配置文件。若是在开发过程当中，团队成员的Scratch Org配置相同，咱们能够在配置好一个配置文件之后share给团队成员便可。

 配置

当咱们使用CLI命令行时，咱们能够任意命名做为Scratch Org的配置文件，当咱们使用Visual Studio Code时，会在config目录下生成一个后缀为scratch-def.json的文件。为了统一以及方便，建议无论使用CLI仍是Visual Studio Code都以scratch-def.json这种方式命名。Scratch Org在salesforce中有一个标准的object对应，咱们配置此文件也是基于里面的一些标准字段进行配置。若是项目中要求有一些特殊的配置，咱们也能够在这个表中新建字段，而后配置在配置文件中。

下面的demo为官方给的一个配置文件的sample

 1 {  2  "orgName": "Acme",  3  "edition": "Enterprise",  4  "features": ["Communities", "ServiceCloud", "Chatbot"],  5  "settings": {  6  "orgPreferenceSettings": {  7  "networksEnabled": true,  8  "s1DesktopEnabled": true,  9  "s1EncryptedStoragePref2": false 10  }, 11  "omniChannelSettings": { 12  "enableOmniChannel": true 13  }, 14  "caseSettings": { 15  "systemUserEmail": "support@acme.com" 16  } 17  } 18 }

这里的配置信息能够很灵活，想要了解这些字段的配置信息以及能够选择哪些赋值，能够自行参看文档。

建立

 使用CLI方式建立一个scratch org须要使用force:org:create指令，他有不少参数能够选择，这里咱们使用经过读取scratch-def.json方式建立，demo以下：

sfdx force:org:create -f config/project-scratch-def.json --setalias my-sample-scratch-org --setdefaultusername

 其中 -f指定当前的配置文件的路径， setalias为设置当前scratch org的别名, --setdefaultusername为设置当前的scratch org为默认的scratch org，其余的咱们也能够设置当前这个scratch org的能够active的时间，设置是否拥有namespace等等。如下截图内容为在sfdx-simple目录的config下有配置文件，经过读取这个配置文件生成scratch org的demo。

 登录

针对一个dev hub可能有多个Scratch Org，从上面截图也能够看出目前系统有两个Scratch Org，那么我如何访问指定的一个scratch org，这个时候须要用到force:org:open的命令行，该命令行中的param没有required的项，想要了解更多的param自行查看文档，咱们这里只须要设置 -u的命令符，后面跟着username或者alias便可打开某个固定的Scratch Org环境。

 Push source 到 Scratch Org

当咱们在本地修改了某些东西后，咱们须要将这些改动同步到Scratch Org中，咱们须要进行push操做，对应的CLI命令行为force:source:push。须要注意一点的是，这个命令行只适用于本地project到Scratch Org的同步，若是咱们但愿不一样的org或者不一样的sandbox迁移，须要使用metadata api去实现。

正常状况下，push操做会将全部的metadata都同步到Scratch Org，若是咱们但愿filter掉相关的配置信息，咱们须要在.forceignore文件中配置不想同步的项。当咱们不加参数只运行force:source:push，咱们默认的是project到默认的Scratch Org，若是咱们但愿同步代码在Project到指定的scratch org，须要添加 -u 这个参数。push操做能够设置不少功能，好比如何调用到.forceignore文件去过滤同步的文件等等，感兴趣的自行查看文档。

 Pull Source从Scratch Org到本地Project

当咱们在建立好Scratch Org，建立好本地环境之后，须要进行将Scratch Org到本地Project的同步，而后开发人员便会本地进行开发。咱们可使用force:source:pull命令行将Scratch Org环境里面的metadata同步到本地project。此命令行只能用于scratch org，若是你想同步source到其余的org。须要使用metadata api(force:mdapi:retrieve/force:mdapi:deploy)。部署之前，咱们能够经过force:source:status来看咱们哪些source有改动。更多功能自行查看文档。Demo中我将DemoController修改而且进行部署。

 

CLI内容只说这么多，还有不少地方没有涉及到，好比怎么在scratch org新建用户，新建component, retrieve 以及deploy(这两个常常用到，须要本身慢慢看)等等。感兴趣的能够自行查看文档进行深刻学习。

二. 下载安装Visual Studio Code而且安装相关扩展包

去官网下载Visual Studio Code：https://code.visualstudio.com/， 下载好之后正常安装打开便可。打开welcome页面，能够看到visual studio code针对主要的几个按钮以及操做设置的快捷键，这几个按钮操做咱们后期会常常用到。

 

三. 安装必要的扩展包

点击左侧的Extensions，搜索区域搜索 'Salesforce Extension Pack'选中安装便可。这个包里面整合了不少salesforce经常使用的工具包，咱们能够看到经常使用的有apex/ visualforce/aura，由于这个整合的包里面没有支持的lightning web component的包，因此最好咱们在安装一下用于LWC开发的扩展包，此处搜索‘Lightning Web Components’安装便可。

 

 以上准备工做作好之后，即可以使用 Visual Studio Code进行salesforce的开发。上面的命令行咱们实现的只是本地project与scratch org的交互，可是没有涉及到scratch org/project与DevHub的交互。下面的Visual Studio Code简单的介绍一下project与Dev Hub的交互。由于须要学的操做步骤太多了，因此这里不写太多的细节，深刻理解能够参看：Salesforce Extensions for Visual Studio Code 

一般开发步骤以下：

 1. 建立Salesforce DX Project:  windows/linux 使用 ctrl + shift + p 快捷键打开 commands,mac是command + shift + p，如下以windows讲。输入 sfdx: Create Project，选中后，输入Project名称，这里Demo输入的是'My Dev Edition Project'，而后选择要生成的文件夹点击‘Create Project’。

2. Authorize an Org: 当咱们建立完项目之后，咱们须要将这个Project绑定咱们的一个环境中，ctrl + shift + p 打开commands，输入sfdx: Authroize an Org，选择Project Default后输入Org 别名，而后系统会经过默认浏览器跳转，输入你想要受权的salesforce环境的帐号密码，登录后VS Code便会有相似受权成功的标识。

 3. 受权完之后咱们能够建立相关的component，这里咱们建立一个apex class，而后名字起名为Test Class。这里咱们ctrl + P,输入sfdx:create apex class，输入指定名字，选择默认的路径便可。

4. 在本地更改完之后，能够经过sfdx:deploy操做，即可以将此类部署到DevHub上了。

 总结：篇中只是以简单方式作了CLI以及Visual Studio Code使用DX的demo，其中针对CLI没有涉及到如何部署到Dev Hub以及建立component等等。针对Visual Studio Code没有涉及到和Scratch Org进行交互。感兴趣的小伙伴能够查看这两个部分对应的官方文档。此篇也是边学边写，内容可能有错误的地方，若是有错误的地方欢迎指出，有不懂的欢迎留言。也感谢学这块技术时，学习群的各位大神的帮助。

原文出处：https://www.cnblogs.com/zero-zyq/p/10973679.html