lwc recipes下載 - lwc recipes原始碼下載

lwc recipes

其他源碼

1.0.0

下載

Lightning Web 元件配方

食譜標誌

Lightning Web 元件的易於理解的程式碼範例集合。每個食譜都示範如何在遵循最佳實踐的同時，用盡可能少的程式碼行編寫特定任務。「查看原始碼」連結可直接轉至 GitHub 上的程式碼。從「Hello World」到資料存取和第三方函式庫，總有一個秘訣！

透過完成快速入門：探索 LWC 食譜範例應用程式 Trailhead 專案或觀看此簡短的演示視頻，以了解有關此應用程式的更多資訊。

此範例應用程式設計為在 Salesforce Platform 上執行。如果您想在任何平台上體驗 Lightning Web Components，請造訪 https://lwc.dev，並嘗試我們的 Lightning Web Components 範例應用程式 LWC Recipes OSS。

使用 Scratch Org 安裝應用程式：這是建議的安裝選項。如果您是想要體驗應用程式和程式碼的開發人員，請使用此選項。
使用解鎖包安裝應用程式：此選項可讓任何人在不安裝本機開發環境的情況下體驗範例應用程式。
使用 Developer Edition Org 或 Trailhead Playground 安裝應用程式：在處理 Trailhead Badges 或希望將應用程式部署到比 Scratch 組織更永久的環境時非常有用。
可選安裝說明
代碼之旅

使用 Scratch Org 安裝應用程式

設定您的環境。請依照快速入門：Lightning Web Components Trailhead 專案中的步驟進行。步驟包括：

在 Trailhead Playground 中啟用開發中心
安裝 Salesforce CLI
安裝 Visual Studio 程式碼
安裝 Visual Studio Code Salesforce 擴展，包括 Lightning Web Components 擴充功能

如果您尚未這樣做，請授權您的 hub 組織並為其提供別名（以下命令中的myhuborg ）：
```
sf org login web -d -a myhuborg
```

克隆 lwc-recipes 儲存庫：

git clone https://github.com/trailheadapps/lwc-recipes
cd lwc-recipes

建立一個臨時組織並為其提供一個別名（以下命令中的lwc-recipes ）：
```
sf org create scratch -d -f config/project-scratch-def.json -a lwc-recipes
```
將應用程式推送到您的臨時組織：
```
sf project deploy start
```
將食譜權限集指派給預設使用者：
```
sf org assign permset -n recipes
```

匯入樣本資料：

sf data tree import -p ./data/data-plan.json

打開臨時組織：
```
sf org open
```
在「設定」中的「主題和品牌」下，啟動「Recipes Lite」或「Recipes Blue」主題。
在應用程式啟動器中，按一下查看全部，然後選擇LWC應用程式。

使用解鎖包安裝應用程式

如果您想要將應用程式部署到比 Scratch 組織更永久的環境，或者您不想安裝本機開發工具，請按照這組說明進行操作。您可以使用非來源追蹤組織，例如免費的 Developer Edition Org 或 Trailhead Playground。

確保從全新的環境開始，以避免與您之前所做的任何工作發生衝突。

登入您的組織
點擊此連結可在您的組織中安裝 Recipes 解鎖包。
選擇為所有使用者安裝
匯入帳戶和聯絡人資料：

按一下此處造訪Accounts-Contacts.csv檔案。右鍵單擊瀏覽器視窗並將檔案另存為Accounts-Contacts.csv 。
在「設定」中，在「快速尋找」方塊中鍵入「資料導入」 ，然後按一下「資料匯入精靈」 。
按一下啟動精靈。
按一下「帳戶和聯絡人」，然後按一下「新增記錄」 。
將剛剛儲存的Accounts-Contacts.csv檔案拖曳到上傳區域。
按一下「下一步」 、 「下一步」和「開始導入」 。

如果您嘗試在 Trailhead 上快速啟動，則需要執行此步驟，否則請跳過：

前往設定 > 使用者 > 權限集。
點擊食譜。
按一下「管理分配」 。
檢查您的使用者並點擊“新增分配” 。

在「設定」中的「主題和品牌」下，啟動「Recipes Lite」或「Recipes Blue」主題。
在應用程式啟動器中，按一下查看全部，然後選擇LWC Recipes應用程式。

使用 Developer Edition Org 或 Trailhead Playground 安裝應用程式

如果您想將應用程式部署到比 Scratch 組織更永久的環境，請按照這組說明進行操作。這包括非來源追蹤組織，例如免費的 Developer Edition Org 或 Trailhead Playground。

確保從全新的環境開始，以避免與您之前所做的工作發生衝突。

克隆此存儲庫：

git clone https://github.com/trailheadapps/lwc-recipes
cd lwc-recipes

授權您的 Trailhead Playground 或 Developer 組織並為其提供別名（以下命令中的mydevorg ）：
```
sf org login web -s -a mydevorg
```
在終端機中執行此命令以部署應用程式。
```
sf project deploy start -d force-app
```
將recipes權限集指派給預設使用者。
```
sf org assign permset -n recipes
```

導入一些範例資料。

sf data tree import -p ./data/data-plan.json

如果您的組織尚未開放，請立即開啟：
```
sf org open -o mydevorg
```
在「設定」中的「主題和品牌」下，啟動「Recipes Lite」或「Recipes Blue」主題。
在應用程式啟動器中，選擇LWC應用程式。

可選安裝說明

如果您想要將現代 Web 開發工具整合到 Salesforce 開發流程或持續整合/持續部署流程中，此儲存庫包含多個相關文件。

程式碼格式化

Prettier 是一個程式碼格式化程序，用於確保整個程式碼庫的格式一致。若要將 Prettier 與 Visual Studio Code 結合使用，請從 Visual Studio Code Marketplace 安裝此擴充功能。 .prettierignore 和 .prettierrc 檔案作為此儲存庫的一部分提供，用於控制 Prettier 格式化程式的行為。

警告目前的 Apex Prettier 外掛程式版本要求您安裝 Java 11 或更高版本。

代碼檢查

ESLint 是一種流行的 JavaScript linting 工具，用於識別風格錯誤和錯誤結構。若要將 ESLint 與 Visual Studio Code 結合使用，請從 Visual Studio Code Marketplace 安裝此擴充功能。 .eslintignore 檔案是作為此儲存庫的一部分提供，用於在 Lightning Web 元件開發的上下文中從 linting 過程中排除特定檔案。