先日発表されたThe State of JavaScript 2021では98%の満足度を獲得しエンジニアからの高い注目度がうかがえるViteですが、ビルドツールのため静的なページの生成には別途仕組みが必要になるかと思います。 公式のテンプレートにはVueやReactなどがサポートされていますが、これらは学習コストやプロジェクトの要件にもより気軽に導入できるものではないかもしれません。 そこで今回はページの生成に静的サイトジェネレーターのEleventy(以下、11ty)を利用し、Viteの高速な開発体験の恩恵を受けつつ11tyでページを生成するシンプルな静的サイトの開発環境を作ってみたいと思います。 ※11tyについての記事はこちら (バージョンが記事公開時より更新されていますので利用の際は公式ドキュメントをご確認ください) 環境Node.js: v16.12.0 ※Viteの利用には1
![ViteとEleventyで静的サイト構築 | EvoLab.](https://cdn-ak-scissors.b.st-hatena.com/image/square/c406936b0af0cddd7c3e6a69aba34292efc2d198/height=288;version=1;width=512/https%3A%2F%2Fimages.microcms-assets.io%2Fassets%2Fa825b67e3494487eb265986360c81314%2Ffd64a9e7efad497eb4705322cbe71b85%2Fvite-with-eleventy.jpg)