teeny
1.0.0
️ Avertissement: Ceci est un outil que j'ai construit en quelques heures pour générer mon blog personnel yakkomajuri.github.io. Il ne fait pas grand-chose pour le moment et probablement le cas.
npm i -g teeny-cli # yarn global add teeny-cli
teeny init && teeny developPour un exemple de projet utilisant Teeny, consultez le dépôt de mon blog personnel.
Vous pouvez lire ma motivation pour construire un petit article sur ce billet de blog intitulé "Pourquoi j'ai construit mon propre générateur de sites statiques".
Initialiser un petit projet dans le répertoire actuel
teeny init Créez les fichiers HTML statiques et ajoutez-les au public/
teeny buildDémarrer un adorable serveur local qui écoute les modifications de fichiers
teeny developTeeny est un générateur de sites statique super simple conçu pour répondre à mes besoins et à mes besoins seulement.
Tout ce qu'il fait est de générer des pages basées sur des modèles HTML et du contenu Markdown.
Il fait très peu et est fortement opiniâtre ( lire: j'étais trop paresseux pour construire des gestionnaires de personnalisation / conditionnels ), mais m'a permis de construire un blog avec lequel je suis très rapidement.
Essentiellement, il n'y a vraiment que 2 concepts auxquels vous devez penser: les modèles et les pages.
Modèles
Les modèles sont un HTML unis et doivent être ajoutés à un templates/ sous-répertoire.
Ils peuvent contenir un élément avec le page-content ID, où Teeny ajoute le HTML généré par l'analyse du contenu Markdown.
Pages
Markdown est un citoyen de première classe dans Teeny, donc toutes les pages de votre site Web sont définies par un fichier de démarrage.
Le fichier n'a cependant pas besoin d'avoir un contenu réel, donc si vous voulez qu'une page soit définie uniquement dans HTML, vous avez juste besoin de créer un modèle qui est référencé à partir d'un fichier de page.
Pour spécifier le modèle qu'une page doit utiliser, vous pouvez le spécifier dans la masse avant de la page, comme ainsi:
---
template: blog
---
Dans l'exemple ci-dessus, Teeny cherchera un modèle appelé blog.html . Si aucun modèle n'est spécifié, Teeny recherche un fichier default.html dans templates/ et l'utilise.
Voici un exemple de Teeny au travail.
Pour démarrer un petit projet, dirigez-vous à teeny init . Cela créera ce qui suit dans votre répertoire actuel:
.
├── pages
│ └── index.md
├── static
│ └── main.js
└── templates
├── default.html
└── homepage.html
Si vous exécutez alors teeny build , vous vous retrouverez avec ceci:
.
├── pages
│ └── index.md
├── public
│ ├── index.html
│ └── main.js
├── static
│ └── main.js
└── templates
├── default.html
└── homepage.html
index.md utilise le modèle homepage et ensemble, ils génèrent index.html . Comme il est standard avec d'autres SSG, les fichiers statiques sont servis à partir de public/ .
Vous remarquerez également que main.js a été transféré en public/ aussi. Teeny prendra en fait tous les fichiers non-modèles et non page à partir de pages/ , templates/ et static/ et de les copier en public/ , suivant la même structure à partir du répertoire d'origine.
La raison en est que je ne voulais en fait pas avoir des importations "magiques", où vous devez importer des actifs statiques à partir de chemins qui ne correspondent pas à la structure du répertoire réel. En conséquence, j'ai décidé que les fichiers statiques vivraient simplement à l'intérieur templates/ et pages/ si nécessaire.
Plus tard, je me suis rendue à l'approche static/ répertoire, car il peut y avoir des actifs, les pages et les modèles souhaitent utiliser. Les importations de static/ sont "magiques", ce qui signifie que vous devez penser à la sortie de teeny build pour qu'ils fonctionnent.
La dernière commande selon laquelle les adolescents soutiens est teeny develop . Cela crée un serveur HTTP sur les fichiers de serveur du public/ sous-répertoire.
Il écoute les modifications des fichiers et met à jour les fichiers statiques à la volée (naïvement, en reconstruisant tout à chaque fois qu'il détecte un changement).
Je veux rester aussi minuscule que possible. J'ai délibérément mis tout le code dans un seul fichier pour moi-même que cela est censé être un outil simple pour moi de créer rapidement des blogs statiques simples.
Cependant, il pourrait utiliser quelques mises à niveau "d'expérience du développeur", comme une approche optimisée de teeny develop au lieu de tout reconstruire naïvement, ainsi que de meilleures options de personnalisation.
