今日は、GitHub を使用して画像ホスティングをする方法について共有します。まず、このツールである picx をおすすめします。
GitHub リポジトリ:https://github.com/XPoet/picx
この記事の画像はすべてこのツールを使用してアップロードし、Staticaly を使用して CDN で高速化されています(アップロード時に自動的にリンクが生成されます)。
自動的に圧縮し、webp 形式に変換することもできます。
GitHub API をベースに開発された、CDN アクセラレーション機能を備えた画像ホスティング管理ツール。ダウンロードやインストールは不要で、ウェブブラウザ上でオンラインで使用できます!無料!安定!便利!高速!
ソースコードを見てみましたが、すべて静的でローカルストレージを使用していますので、バックエンドはありません。
つまり、開発者が提供するドメインを使用せずに、自分のドメインにデプロイすることもできます。あまり違いはありませんが、少し試してみましょう。
最後に、パッケージ化されたリンクを提供します(ソースコードをそのままパッケージ化し、変更はありません)。ダウンロードして、ドメインスペースにアップロードして使用してください。
ドキュメント:https://picx-docs.xpoet.cn/tutorial/get-start.html
これが公式の説明です。試してみましたが、効果は素晴らしいです。画像ホスティングの使用方法は、ドキュメントに明確に記載されていますので、ここでは繰り返しません。この記事では、コンパイルとパッケージ化の方法について説明します。グループメンバー向けです。
手順は非常に簡単で、事前に Node.js 環境を準備する必要があります。
1. ソースコードのダウンロード#
https://github.com/XPoet/picx にアクセスし、[Download Zip] をクリックします。
2. コマンドの実行#
ダウンロードしたファイルを解凍し、このページに移動して、空白の場所で右クリックしてターミナルを開きます。
すでに Node.js 環境がある場合は、以下のコマンドを実行します。環境がない場合は、まず Node.js 環境をインストールしてください(https://nodejs.org/zh-cn/)。以下の 2 つの方法のいずれかを使用できます。
# 依存関係のインストール
# ネットワークの問題により、このプロセスは遅くなる場合があります
npm install
#または
yarn
依存関係のインストールが完了したら、ビルドを開始します。
# ビルド
npm run build
#または
yarn build
ビルドが完了すると、dist
フォルダが生成されます。これがパッケージ化されたファイルであり、index.html
とその他の静的リソースが含まれています。
3. どこにアップロードすればいいですか?#
この時点で、それらをアクセスしたいドメインのディレクトリにアップロードするだけです。
たとえば、私は hugo ブログプログラムを使用しています。まず、content
フォルダの下に新しいフォルダを作成し、img
と名付けます(任意の名前を付けることができますが、他のファイル名と競合しないように注意してください)。次に、dist
フォルダのすべてのファイルを/content/img/
フォルダにコピーします。
これにより、hugo コマンドを実行すると、public
フォルダにパッケージ化されます。その後、https://zburu.com/imgに直接アクセスすると、画像ホスティングができます。
または、任意のスペースにアップロードすることもできます。
画像ホスティングの使用方法については、ドキュメントを参照してください。
https://picx-docs.xpoet.cn/tutorial/get-start.html
4. その他の問題#
- 開発者が後で画像ホスティングのバージョンを更新した場合、最初から操作をやり直す必要があります。ダウンロード、ビルド、アップロードの手順を実行してください。
その他の質問がある場合は、コメント欄にメッセージを残してください~~