@frontj/builder

frontJでHTMLファイルを書き出す際に有用なパッケージです。

Install

npm install -D @frontj/builder

Example

import { div } from '@frontj/elements'
import { build, generateRoutes } from '@frontj/builder'

const posts = [
  {
    id: 1,
    content: 'post1'
  },
  {
    id: 2,
    content: 'post2'
  },
  {
    id: 3,
    content: 'post3'
  }
]

build({
  outDir: 'public',
  routes: {
    '/': div('top'),
    ...generateRoutes(posts, (post) => {
      return [`/posts/${post.id}/`, div(post.content)]
    })
  }
})

Documentation

Methods

build

ファイルを書き出します。

build(options: FrontJBuildOptions): void

引数	説明
options	各種オプション設定用オブジェクト。設定項目はFrontJBuildOptions型の項目に記載しています。

generateRoutes

配列からFrontJRoutes型のオブジェクトを生成するメソッドです。
FrontJBuildOptions型のroutesプロパティに値を設定する際に有用です。

generateRoutes<T>(array: T[], callback: (item: T, index: number) => [string, string]): FrontJRoutes

引数	説明
array	オブジェクトを生成する元となる配列。
callback	arrayの各要素とそのインデックスを引数に受け取る関数。[`出力先のパス`, `ファイルの内容`]の形をした配列を返す必要があります。

Types

FrontJBuildOptions

buildメソッドのoptions引数の型として使用されます。

FrontJBuildOptions {
  outDir?: string;
  routes: FrontJRoutes;
}

引数	説明
outDir	出力先ディレクトリ名。省略すると'dist'になります。出力の際、outDir以下のHTMLファイルは削除されます(HTML以外のファイルは残されます)。
routes	ルート設定用オブジェクト。詳細はFrontJRoutes型の項目に記載しています。

FrontJRoutes

FrontJBuildOptions型のroutesプロパティの型として使用されます。

FrontJRoutes {
  [route: string]: string;
}

引数	説明
route	出力先のパス。/foo/bar/(または/foo/bar)とすると/foo/bar/index.htmlが出力されます。/foo/bar.htmlとするとHTMLファイルを作成することができます。このプロパティの値がHTMLファイルに書き込まれます。

License

MIT