stakit

stakit

Une boîte à outils modulaire pour créer des sites Web statiques

Stakit est un framework qui vous aide à composer de puissants pipelines de construction pour des sites Web statiques sans transpirer. Il est minimal et modulaire, utilise des flux et la boîte à outils Stakit contient de nombreux plugins et transformations que vous pouvez utiliser.

Stakit en est encore aux premiers stades de développement, mais vous pouvez le prendre et l'utiliser pour voir si vous devez vous en soucier ou non.

Caractéristiques

• indépendant du framework : fonctionne avec n'importe quel framework capable de générer une chaîne

• modulaire : vous n'avez jamais ce dont vous n'avez pas besoin, mais vous pouvez l' npm install

• petite API : elle ne dispose que de 7 méthodes principales, dont seulement 3 que vous devez utiliser

• aucune contrainte : vous n'êtes jamais limité par les fonctionnalités et les modèles d'un générateur de site statique

• rapide, efficace en mémoire : utilise beaucoup de flux

Installation

npm i stakit

Exemple

 var stakit = require('stakit')var { render, hydrate } = require('stakit-choo')var app = require('.')var kit = stakit()
  .routes (fonction (état) {retour [ '/' ]
  })
  .render(render(application))
  .transform(hydrate)kit.output(stakit.writeFiles('./public'))

Pourquoi?

Généralement, vous faites 2 choses lors de la génération d'un site statique :

• remplissez votre application avec du contenu

• copier des fichiers statiques

Il existe de nombreux outils modulaires (et charmants) pour regrouper Javascript ou transformer CSS, Stakit est quelque chose de similaire, mais pour le site complet, et se concentre particulièrement sur les fichiers HTML.

Vous devrez gérer le regroupement de votre application et inclure le bundle si c'est ce dont vous avez besoin. Suivant la philosophie de Choo, il est petit, compréhensible et facile à utiliser. Il a été conçu pour fonctionner principalement avec Choo, mais il devrait également fonctionner avec d'autres frameworks isomorphes.

Usage

Stakit est appelé par programme, et non à partir de la ligne de commande, vous aurez donc besoin d'un fichier Javascript (comme build.js ), là où vous en avez besoin. Ensuite, vous pouvez initialiser le kit avec stakit() puis enchaîner quelques méthodes.

Deux méthodes doivent apparaître dans le pipeline :

• routes(fn)

• render(fn)

Toutes les autres méthodes sont facultatives et appelées dans l'ordre suivant :

1. tous les middlewares appliqués par kit.use()

2. la fonction routesReducer appliquée

3. pour chaque itinéraire :

1. un seul appel au renderer appliqué

2. tous les appels transform

Terminez le pipeline avec kit.output() .

API

Cette section fournit une documentation sur le fonctionnement de chaque fonction de Stakit. Il s'agit d'une référence technique.

kit = stakit()

Initialisez une nouvelle instance kit .

kit.html(template, selector)

Définit le modèle HTML et le sélecteur de départ.

kit.use(fn(context))

Pousse un middleware/plugin vers la liste des middlewares, les fonctions à usage général sont exécutées avant la génération de la route. Vous pouvez modifier le contexte comme vous le souhaitez, de la modification de l' state à l'installation transform s.

 kit.use(fonction (ctx) {
  ctx._transforms.push(transform)})

Voir Middlewares pour plus d’informations.

kit.routes(routeReducer(state))

Le routeReducer est une fonction qui obtient context.state en tant que paramètre et renvoie un Array de chaînes/routes. Ce sont les routes sur lesquelles Stakit appellera render .

 kit.routes (fonction (état) {
  retourner Object.keys (state.content)
  // ou statiquement
  return [ '/', '/about', '/blog' ]})

kit.render(renderer(route, state))

Définit le moteur de rendu de la build. C'est là que la magie opère. Le renderer sera appelé pour chaque route renvoyée par routes .

Il doit renvoyer un objet avec les valeurs suivantes :

 {
  html: string, // le résultat du rendu
  state: object // l'état après le rendu (facultatif)}

Les transformations recevront l'état mis à jour renvoyé ici.

kit.transform(transformFn, opts)

Pousse une transformation vers la liste des transformations. Stakit utilise documentify et streams pour créer le HTML.

Ils sont appelés après que le contenu rendu a été remplacé dans le HTML.

Voir Transformations pour plus d'informations.

kit.output(writerObject)

Démarre le pipeline de construction et le termine en transmettant toutes les routes writerObject.write({ destination, stream }) . Renvoie une Promise qui attend que tous les fichiers (routes et statiques) soient complètement écrits.

Par défaut, il utilise un Writer qui affiche le site dans le répertoire ./public .

Voir Écrivains pour plus d’informations.

Intergiciels

Middlewares intégrés :

stakit.state(extendState)

Utilitaire pour vous aider à ajouter des valeurs à context.state

 kit.use(stakit.state({ message : 'bonjour !' }))

stakit.copy(files)

Middleware pour copier des fichiers dans le répertoire de sortie.

 // Copiez les fichiers au même emplacementkit.use(stakit.copy([ 'robots.txt' ]))// Copiez les fichiers vers un emplacement différent dans le chemin de sortiekit.use(stakit.copy({
  'robots.txt' : 'robots.txt',
  'sitemap.xml' : 'sitemaps/sitemap.xml'}))

Transformations

Documentify est très puissant et peut facilement être modulé. Le format général d'une transformation Stakit est :

 // enveloppé dans une fonctionfunction lang (contexte) {
  // renvoie la transformation documentify
  return function (lang) {// renvoie un flux de transformationreturn hstream({ html: { lang: lang } })
  }}

Remarque : hstream est un très bon ami !

La transformation documentify est enveloppée dans une fonction, afin que nous puissions obtenir le context lorsque nous en avons besoin, sans jouer avec l'API de documentify . Si vous souhaitez contourner cela, vous pouvez simplement renvoyer la transformation documentify à partir d'une fonction.

Découvrez quelles transformations sont fournies avec Stakit dans transforms/readme.md .

Écrivains

Les rédacteurs génèrent les fichiers statiques générés et transformés. Cela peut varier de la sortie vers le système de fichiers à la mise dans une archive Dat.

Un écrivain doit implémenter une méthode : write . Pour chaque fichier, y compris les pages générées + les fichiers ajoutés à context._files , writer.write sera appelé avec un objet fichier. Il doit renvoyer une Promise qui revient après que le canal a été vidé (le fichier a été complètement écrit).

Un objet fichier ressemble à ceci :

{
  source: null | string,
  destination: string,
  stream: Stream
}

Il est recommandé de nettoyer le répertoire de sortie avant chaque build.

Jetez un œil à la méthode intégrée stakit.writeFiles à titre d'exemple.

C'est tout une question d'écrivains.

Voir aussi

• choo - framework frontal robuste de 4 Ko

• documentify - Bundleur HTML modulaire

• jalla - Compilateur Web ultra-rapide et serveur en un (merci également pour les nombreux extraits de code !)