lobsite! ログイン アカウント作成

Eleventy (11ty) ホスティング

Eleventy (11ty) サイトをホストできます。ビルドすると npx lobsite が _site/ をデプロイし、変更されたファイルのみをアップロードします。アカウント不要で無料で試せて、HTTPS も含まれます。

Eleventy は _site/ にビルドし、npx lobsite がそれを検出してデプロイします。
HTML ファイル、フォルダ、または .zip をドロップ ブラウザ内で確認します。公開するまで何もアップロードされません。

Eleventy (11ty) はテンプレートと Markdown を受け取り、通常の HTML を _site/ に書き出します。追加しない限りクライアント側のフレームワークはありません。通常のファイルのフォルダは最も簡単にホストできます。ビルドしてから npx lobsite を実行すると、HTTPS 対応の *.lobsite.app アドレスでサイトが公開されます。上のボックスに _site/ をドロップすることもできます。

仕組み

  1. npx @11ty/eleventy(または npm run build)でサイトをビルドします。Eleventy は _site/ に書き出します。
  2. プロジェクトで npx lobsite を実行します。_site/ を検出してデプロイします。最初のデプロイにアカウントは不要で、6 時間有効です。
  3. 取得リンクから無料アカウントにサイトを残します。フォルダは lobsite.toml に保存されるため、以降のデプロイは同じサイトに反映されます。

Lobsite で重要な Eleventy の設定

// eleventy.config.js
export default function (eleventyConfig) {
  eleventyConfig.addPassthroughCopy("img");
  eleventyConfig.addPassthroughCopy("css");
}

export const config = {
  dir: { input: "src", output: "_site" },
};
  • パススルーコピーは、画像、フォント、CSS を _site/ に届ける方法です。テンプレートでもコピー対象でもないファイルはデプロイされないため、公開サイトで何かが欠けている場合は、まず _site/ にあるか確認してください。
  • pathPrefix は / のままにします。サイトはアドレスの最上位から配信されます。
  • 出力フォルダは _site のままでかまいません。変更する場合は一度フォルダを指定すると(npx lobsite ./dist)、lobsite.toml に記憶されます。

パーマリンク、画像、古いファイル

Eleventy は about.md を about/index.html として書き出し、/about/ で開きます。.html で終わるパーマリンクは拡張子なしで開きます。@11ty/eleventy-img で処理した画像はビルド中に書き出されるため、他のファイルと同じようにデプロイされ、変更のない画像は再アップロードされません。多くのジェネレーターと同じく、Eleventy はビルド前に _site/ を空にしません。名前を変更したページの古いファイルが残ります。現在のページのみをデプロイするには、ビルド前に _site/ を削除してください(多くのスターターは build スクリプトで行っています)。

変更されたファイルのみアップロード

ファイルはハッシュで保存されます。変更のないサイトを再デプロイしてもアップロードは 0 バイトです。

デプロイごとに URL を発行

公開前にプレビューできます。リダイレクトも含めてワンクリックでロールバックできます。

すべてに HTTPS

すべてのサイトに、最初のデプロイから HTTPS 対応の *.lobsite.app アドレスが付きます。

すぐに使えるフォーム

フォームの送信先を /_lobsite/forms/contact にするだけです。スパムフィルターも含まれます。

アカウントなしで試せる

アカウントなしのデプロイは 6 時間公開されます。取得リンクから無料で残せます。

設定は 1 つのファイルに

リダイレクト、ヘッダー、フォームは lobsite.toml に記述し、デプロイごとに一緒に反映されます。

Eleventy ホストの比較

Lobsite Netlify Cloudflare Pages GitHub Pages
Eleventy のビルド いいえ: _site/ をデプロイ はい はい GitHub Actions で
最初のデプロイ前のアカウント 不要: 6 時間公開、その後無料で残せる 必要 必要 必要(リポジトリも)
変更されたファイルのみアップロード はい はい はい Git 経由
デプロイごとのプレビュー URL はい はい はい いいえ
バックエンド不要のフォーム はい(サイトをアカウントに残した後) はい いいえ いいえ
カスタムドメイン はい、無料 はい はい はい

Netlify は長く Eleventy サイトの定番のホストで、Git からビルドします。Lobsite は、ローカルや CI でビルドし、ターミナルや AI エージェントからコマンド 1 つで、設定なしで公開したい場合に向いています。

よくある質問

11ty と Eleventy は同じですか?

はい。11ty は Eleventy の略称で、パッケージは @11ty/eleventy です。このページの内容はどちらの名前にも当てはまります。

デプロイした Eleventy サイトで画像が表示されないのはなぜですか?

おそらく _site/ に入っていません。フォルダのパススルーコピーを追加し(eleventyConfig.addPassthroughCopy("img"))、再度ビルドしてデプロイしてください。

Eleventy のサーバーレスやエッジレンダリングは Lobsite で動作しますか?

いいえ。Lobsite は _site/ のファイルを配信します。リクエストごとにページをレンダリングする機能には、関数を実行するホストが必要です。多くの Eleventy サイトのように事前にビルドされたページはすべて動作します。

Eleventy サイトにカスタム 404 ページを設定できますか?

はい。permalink: 404.html のテンプレートを作成すると、Lobsite は存在しないアドレスに対して 404 ステータスで配信します。

関連項目