nera

NERA-軽量静的サイトジェネレーター

ネラは本当にシンプルな静的サイトジェネレーターです。静的HTMLファイルを作成します
マークダウンファイル。

このソフトウェアはまだ開発中であることに注意してください。以前のバージョンと互換性がない変更があるかもしれません。

始めましょう

システムで少なくともノードバージョン10.2を実行してください

git clone [email protected]:seebaermichi/nera.git

# Install dependencies
npm install

# Run local server (browser-sync)
npm run serve

# Render the static files
npm run render

# Local development
npm start

ディレクトリとファイル構造

 |-- assets/
|-- config/
    |-- app.yaml
|-- pages/
|-- src/
    |-- plugins/
        |-- plugin-helper.js
    |-- core.js
    |-- index.js
    |-- render.js
    |-- setup-plugins.js
|-- views/
|-- index.js

資産

すべてのCSS、JavaScript、フォント、および画像ファイルは、ウェブサイトで使用されています。レンダリングプロセス中、すべての資産がpublicディレクトリにコピーされます。

config

ここでは、Webサイトのグローバル設定を定義できます。すべてのグローバル設定は、 config/app.yamlに到達する必要があります。 Lang、名前などと同様に、ソースまたはプラグインファイル内のdata.appオブジェクト、またはビューファイル内のappオブジェクトとして使用できます。

ページ

ページディレクトリ内に、実際にメタ情報または設定とページのコンテンツを含むMarkdownファイルを追加します。以下のマークダウンファイルの詳細をご覧ください。

SRC

srcディレクトリにはアプリ自体が含まれています。ここでは、 core.js 、 index.js 、 render.js 、およびsetup-plugins.jsファイルを見つけます。マークダウンファイルを読み取り、設定を取得し、プラグインを取得し、資産をコピーし、HTMLファイルをpuplicにレンダリングするすべての機能を含むファイルフォルダ。

プラグイン

srcフォルダーには、 pluginsフォルダーも含まれています。その中には、追加の機能を配置します。
利用可能なプラグインの現在のコレクションをご覧ください。

ビュー

ビューディレクトリでは、すべてのレイアウトファイルを配置します。 Pugをテンプレートフレームワークとして使用します。
Markdownファイルのコンテンツに加えて、利用可能なデータも増えています。 config/app.yamlファイルのすべてのプロパティを含む1つのappオブジェクトがあります。他のオブジェクトはmetaオブジェクトです。 appは、すべてのページに関連するデータまたは使用可能なデータが含まれている場合、 metaオブジェクトにはページ自体のデータのみが含まれます。したがって、マークダウンファイルのメタセクションで定義するすべてのプロパティと値をデフォルトで含めます。さらに、それに含まれます

createdAt
Markdownファイルが作成されたときのDateTimeです

href
現在のHTMLファイルへのパスです

dirname
現在のHTMLファイルのDIRNAMEです

もちろん、 metaオブジェクトには、プラグインがIDに追加されるものに応じて、より多くのデータを含めることもできます。

ページマークダウンファイル

専用のWebページのコンテンツを含む各Markdownファイルは、ヘッドにいくつかの設定が必要です。以下の例を参照してください。

 ---
layout : pages/default.pug
title : Homepage
---
# Content
Content goes here...

もちろん、より多くのいわゆるメタデータを追加できます。 Viewファイルでmetaオブジェクトとして使用できます。
さらに、基本的な構成値はappオブジェクト内で使用できます。

翻訳

Multi-Language WebサイトにNERAを使用する場合は、アプリ構成ファイルに翻訳を追加してPUGテンプレートのt関数を使用することで簡単にこれを行うことができます。
config/app.yaml

...
translations :
  en :
    app_description : Nera is an easy to use and light weight static site generator
  es :
    app_description : Nera es un generador de sitios estáticos liviano y fácil de usar

views/layouts/layout.pug

 . . .
head
    . . .
    meta ( name = "description" , content = ` ${ meta . description || t ( ' app_description ' ) } ` )
    . . .

t関数は、APP COMFITファイルの翻訳のキーを検索し、このキーの翻訳を返します。翻訳プロパティが見つからない場合、または翻訳内に指定されたキーがない場合、関数はキーを返すだけです。

リンク

• NERAがNERAのWebサイトを作成するためにどのように使用されるかについて読む