web.dev

web.dev [存檔]

注意：此站點遷移到一個新平台，並且該存儲庫可在僅閱讀模式下使用。我們不會合併新的拉請求。請在新問題跟踪器中提出內容問題。

Web.dev是所有背景開發人員在Web上學習，創建和求解的最終資源。這不僅是為了教育開發人員，而且要幫助他們將所學的知識應用於個人或業務的任何網站。

---

[存檔的讀書文件]

建立網站？

您需要最新版本的節點：V14（LTS）或更高版本。要檢查您的節點版本在終端中運行node -v 。

如果您沒有節點，或者需要升級，建議使用節點版本管理器（NVM）。

克隆倉庫

git clone https://github.com/GoogleChrome/web.dev.git

將目錄更改為創建的文件夾

 cd web.dev

安裝依賴項

npm ci

啟動本地服務器預覽網站

npm run dev

打開http://localhost:8080/以查看本地網站。資產的更改將重建網站。刷新您的變化。

設置構建標誌

建造整個網站可能需要一段時間，因為它大約是一千頁。如果您想大大加快構建時間，我們建議設置一些構建標誌以忽略某些部分。

• 在項目的根部創建.env文件
• 添加以下內容：

 # Ignore ALL site content
ELEVENTY_IGNORE=true

# Only build the directories you're working on.
# Note, this is a JSON string so you must use double quotes.
ELEVENTY_INCLUDE=["blog", "vitals"]

環境？

設置ELEVENTY_ENV=prod to to lose to lose build構建。這是運行“階段”或“部署”時的默認值。儘管未指定，但我們的高度站點配置將默認為“開發”，但沒有其他對ELEVENTY_ENV的其他選項。

當前生產構建需要大量內存，以至於node可能會在

FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory

v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate * , char const * , bool) [node]

所需的確切堆空間的確切量因計算機而異以及node的版本。如果您需要本地生產構建，但記憶不足，則可以通過添加--node-options '--max_old_space_size=8192' （將8GB的堆空間分配給npm命令）來增加堆大小run例如：

ELEVENTY_ENV=prod npm --node-options ' --max_old_space_size=8192 ' run build

登台？

當您發送拉動請求時，它將自動為您上演。請留意NetLify Bot，以您的唯一URL對拉的請求發表評論。

部署網站

自動部署

該站點將每小時每小時自動建立和部署主要分支。如果您剛剛合併了一篇文章，那麼它應該在下一個小時的頂部直播。

手動部署

要手動部署網站，您需要成為這些Google團隊之一的成員：

• web.dev-eng
• Web.Dev擁有者

1. 導航到雲構建觸發器頁面。
2. 單擊“啟用”的運行按鈕。
3. 在打開的側抽屜中，單擊“運行觸發”按鈕以獲取主分支的觸發器。

注意：如果main分支機構有新提交，則Web.DEV自動部署每小時。只有在構建失敗或禁用自動部署時，才應發生手動部署。

偵錯?

如果您需要調試網站的構建過程：

1. 向.eleventy.js添加debugger語句
2. 運行npm run debug:eleventy
3. 轉到about://inspect以連接到運行過程。