Salesforce（0）：使用VsCode使用Aura组件并展示组件扩展
????目录
????摘要
今天博主将给大家分享–Salesforce（0）：使用VsCode使用Aura组件并展示组件扩展。欢迎关注收藏！
⛳代码补全
Aura组件扩展基于VS Code用于HTML和JavaScript的语言功能，包括语法突出显示，括号匹配以及使用IntelliSense的特定于语言的代码完成。该扩展为以下Lightning Web Components资源提供代码完成。
Tag–标签
- 注意：如果您的工作区中有任何Lightning Web组件，这些组件也将出现在建议完成的列表中。Lightning Web Component建议将以正确的Aura语法显示。
属性
????悬停查看组件文件
将鼠标悬停在组件名称或属性上会在编辑器中显示组件文档，以及指向组件库的链接。您可以查看Aura组件和嵌套在Aura组件中的Lightning Web组件的参考文档。
这是该lightning:card组件的参考文档。
❤Linting
在您编辑时，Linting提供有关格式错误或可疑代码的错误。VS Code强制执行Salesforce的ESLint规则。要**ESLint，请从命令行安装它。传送门：SalesForce系列
注意：当您在CSS style标签中包含模板代码时，lint会引发错误。例如，此代码示例将引发error <div style="{# 'background-image:url(' + v.url+ ')'}"> ... </div>。linter尝试将模板代码验证为CSS。这是Aura LSP中的一个已知问题，您可以忽略该错误。
????代码导航
VS Code提供了快捷方式，可以预览或跳转到代码中的定义，而不会丢失当前正在使用的代码。在VS Code文档的“代码导航”部分中了解更多信息。
要预览定义，请按住
Ctrl（Windows或Linux）或Command（macOS）并将鼠标悬停在要查看其定义的项目上。本示例显示了c名称空间组件源的预览。
这是AuraPubSubAura pubsub组件中引用的Lightning Web组件定义的预览。
要查看定义，请右键单击该项目，然后选择“ Peek Definition”，或按Alt + F12。
要跳至定义的位置，请右键单击该项目，然后选择“ Go to Definition”，或按F12键。
????大纲视图
轮廓视图使您可以查看组件的轮廓，即其HTML标记和JavaScript属性。在Windows和Linux上使用
Ctrl + Shift + O，在Mac上使用Cmd + Shift + O调用它。
????Lightning Explorer（闪电浏览器–测试版）
通过Lightning Explorer，您可以查看Aura组件和Lightning Web组件的参考文档。要启用它，请转到Preferences > Settings。lightning explorer在搜索栏中输入。然后，单击salesforcedx-vscode-lightning：Show Lightning Explorer旁边的复选框。
要使用Lightning Explorer，请单击屏幕左侧的闪电图标。单击名称空间以查看所有可用组件。闪电Web组件和Aura具有不同的闪电图标。
在c名称空间下，我们选择了Lightning Web组件c-wire-get-object-info。当您单击组件的名称时，其对应的文件将显示在主代码面板中。
这是Aura组件force:inputField。组件名称右侧的蓝色图标将浏览器打开到“组件库”中的组件引用。
您的自定义Aura组件和文档也可在Aura组件扩展中找到。要了解有关为Aura组件编写文档的更多信息，请参阅《Lightning Aura组件开发人员指南》。
✍作者
-
更多参考精彩博文请看这里：陈永佳的博客
-
喜欢博主的小伙伴可以加个关注、点个赞哦，持续更新嘿嘿！
????致谢
- 在这里还要感谢默默支持我的小粉丝????【三旬@理想】，后面还要继续努力请多多支持哦！
上一篇： Springboot全局异常配置超简单