vuepressをインストールしてブログを作成する手順

vuepressをインストールしてブログを作成する手順

vueの静的サイトジェネレーターである「vuepress」をインストールしてブログを作成する手順を記述してます。環境はcentos8です。

環境

  • OS  CentOS Linux release 8.2.2004 (Core)
  • node V12.16.3
  • npm 6.14.4

※CentOS8 最新版のnodeとyarnをインストールする手順はこちら

vuepress構築

プロジェクトを構築します。ここでは「test-project」という名前で作成してます。

サイトに関する質問に答えていきます。

プロジェクトが作成されるので、移動します。

ディレクトリの中は下記となります。

vuepressインストール

インストールを行います。

モジュールがインストールされたことが確認できます。

Firewall設定

firewallを利用していれば、8080番ポートを許可しておきます。

vuepress起動

インストールが終わったので起動してみます。

ブラウザから http://プライベートIP or サーバーアドレス:8080 にアクセスすると、デフォルトのテーマが適応されていることが確認できます。

静的ファイル生成

静的ファイルを生成してみます。

buildを行うと「test-project/blog/.vuepress/dist」に静的ファイルが生成されます。

ページ作成

blogのページは「test-project/blog/_posts」にmdファイルを追加して作成します。

ここでは「2019-7-6-writing-a-vuepress-theme.md」を追加しました。

サイトの基本情報は「test-project/blog/.vuepress」にあるconfig.jsで可能です。ここではタイトルのみを変更してます。

タイトルが変更されたことが確認できます。