web.dev

web.dev [アーカイブ]

注：このサイトは新しいプラットフォームに移行され、このリポジトリは読み取り専用モードで利用できます。新しいプルリクエストをマージすることはありません。新しい問題トラッカーでコンテンツの問題を提起してください。

Web.devは、すべてのバックグラウンドの開発者がWebで学習、作成、解決するための究極のリソースです。開発者を教育するだけでなく、学んだことを個人であろうとビジネスであろうと、彼らが学んだことを彼らが彼らが取り組んでいるサイトに適用するのを助けることを意図しています。

---

[アーカイブされたreadme]

サイトを構築しますか？

ノードの最近のバージョン：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/を開き、サイトをローカルに表示します。資産の変更はサイトを再構築します。更新して変更を確認してください。

ビルドフラグを設定します

サイト全体を構築するには、約1000ページであるため、時間がかかる場合があります。ビルド時間を大幅に高速化したい場合は、特定のセクションを無視するためにいくつかのビルドフラグを設定することをお勧めします。

• プロジェクトのルートで.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を設定して、生産ビルドを強制します。これは、「ステージ」または「展開」を実行するときにデフォルトです。 ELEVENTY_ENVの他のオプションはサポートされていませんが、不特定の場合、Eleventy Site Configはデフォルトで「DEV」になります。

現在、生産ビルドには多くのメモリが必要です。これは、 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のバージョンまでさまざまです。ローカルプロダクションビルドが必要であるがメモリが不足している場合は、 run前に、 --node-options '--max_old_space_size=8192' （8GBのヒープスペースを割り当てるために）を追加することにより、ヒープサイズを増やすことがnpmます。例えば：

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

ステージング？

プルリクエストを送信すると、自動的にステージングされます。 Netlifyボットに注目して、一意のURLでプルリクエストについてコメントしてください。

サイトを展開します

自動展開

このサイトは、1時間ごとに自動的にメインブランチを自動的に構築および展開します。記事を合併したばかりの場合は、次の1時間のトップでライブを行う必要があります。

手動展開

サイトを手動で展開するには、これらのGoogleチームのメンバーになる必要があります。

• web.dev-eng
• web.dev-owners

1. クラウドビルドトリガーページに移動します。
2. [Deployという名前のトリガー]の[実行]ボタンをクリックします。
3. 開くサイドドロワーで、メインブランチのトリガーの[トリガー]ボタンをクリックします。

注： mainブランチに新しいコミットがある場合、Web.Dev Autoは1時間ごとに展開します。手動展開は、ビルドが故障した場合、または自動展開が無効になっている場合にのみ発生する必要があります。

デバッグ？

サイトのビルドプロセスをデバッグする必要がある場合：

1. .eleventy.jsにdebuggerステートメントを追加します
2. npm run debug:eleventy実行します
3. runingプロセスに接続するにはabout://inspect 。