LWC Recipes 项目教程

LWC Recipes 项目教程

lwc-recipesA collection of easy-to-digest code examples for Lightning Web Components on Salesforce Platform项目地址:https://gitcode.com/gh_mirrors/lw/lwc-recipes

1. 项目的目录结构及介绍

LWC Recipes 项目的目录结构如下：

lwc-recipes/
├── bin/
├── config/
├── data/
├── force-app/
│   ├── main/
│   │   ├── default/
│   │   │   ├── aura/
│   │   │   ├── lwc/
│   │   │   ├── objects/
│   │   │   ├── permissions/
│   │   │   ├── staticresources/
│   │   │   ├── tabs/
│   │   │   └── ...
│   │   └── ...
│   └── ...
├── forceignore
├── gitignore
├── npmrc
├── prettierignore
├── prettierrc
├── CODE_OF_CONDUCT.md
├── CONTRIBUTION.md
├── LICENSE.md
├── README.md
├── SECURITY.md
├── codecov.yml
├── jest-sa11y-setup.js
├── jest.config.js
├── package-lock.json
├── package.json
└── recipes-logo.png

目录介绍

• bin/: 包含一些脚本文件。
• config/: 包含项目的配置文件。
• data/: 包含数据文件。
• force-app/: 包含主要的 Salesforce 应用代码。
  • main/: 主要代码目录。
    • default/: 默认命名空间。
      • aura/: 包含 Aura 组件。
      • lwc/: 包含 Lightning Web 组件。
      • objects/: 包含自定义对象。
      • permissions/: 包含权限集。
      • staticresources/: 包含静态资源。
      • tabs/: 包含标签定义。
• forceignore: Salesforce DX 忽略文件。
• gitignore: Git 忽略文件。
• npmrc: npm 配置文件。
• prettierignore: Prettier 忽略文件。
• prettierrc: Prettier 配置文件。
• CODE_OF_CONDUCT.md: 行为准则。
• CONTRIBUTION.md: 贡献指南。
• LICENSE.md: 许可证。
• README.md: 项目说明。
• SECURITY.md: 安全指南。
• codecov.yml: Codecov 配置文件。
• jest-sa11y-setup.js: Jest 辅助设置文件。
• jest.config.js: Jest 配置文件。
• package-lock.json: npm 锁定文件。
• package.json: npm 包文件。
• recipes-logo.png: 项目图标。

2. 项目的启动文件介绍

LWC Recipes 项目的启动文件主要是 package.json 中的 scripts 部分。以下是一些关键的启动命令：

{
  "scripts": {
    "test:unit": "lwc-jest",
    "test:unit:watch": "lwc-jest --watch",
    "test:unit:debug": "lwc-jest --debug",
    "lint": "eslint force-app",
    "prettier": "prettier --write \"**/*.{js,jsx,json,md}\""
  }
}

启动命令介绍

• test:unit: 运行单元测试。
• test:unit:watch: 监视文件变化并运行单元测试。
• test:unit:debug: 以调试模式运行单元测试。
• lint: 运行 ESLint 进行代码检查。
• prettier: 运行 Prettier 进行代码格式化。

3. 项目的配置文件介绍

LWC Recipes 项目包含多个配置文件，以下是一些关键的配置文件：

prettierrc

Prettier 配置文件，用于代码格式化：

{
  "singleQuote": true,
  "trailingComma": "all",
  "printWidth": 80
}

jest.config.js

Jest 配置文件，用于单元测试：

module.exports = {
  preset: '@salesforce/sfdx-lwc-jest',
  testMatch: ['**/?

lwc-recipesA collection of easy-to-digest code examples for Lightning Web Components on Salesforce Platform项目地址:https://gitcode.com/gh_mirrors/lw/lwc-recipes