Site Generators A List of Static Site Generators for Jamstack Sites
本サイトは開設当初から静的サイトジェネレーター(SSG)としてEleventyを使っています。 もう1年以上使っていますが、特に大きな問題なく運用できています。 そんなEleventyが2023-02-08にv2.0となりました[1]。 ELEVENTY V2.0.0, THE STABLE RELEASE Eleventyはコンテンツ重視の静的サイト作成に大きなアドバンテージを持っていますが、特に日本では今ひとつ認知度がないと感じます。 そこで、これまでの運用経験からEleventyの入門シリーズを書いてみようかと思います。 EleventyはNode.jsベースの静的サイトジェネレーターです。 主に以下の特徴があります。 デフォルトでゼロコンフィグ。簡単に導入できる。 複数テンプレート言語をサポートし、各々は併用OK(HTML、マークダウン、Liquid、Nunjucks、etc...
はじめに 静的サイトジェネレータをいろいろ調べているうちに 11ty というものを知り、1 度使ってみました。 その際、日本語ドキュメントが少なかったので公式ドキュメントを読んで学んだことをまとめます。 「よし!記事書くか!」となったところ何と 2 週間前にv2.0.0が登場したことを知り、もう一度ドキュメントを読む羽目になりました。 内容が間違っていないかできる限り確かめたつもりですが、間違いがあったらご指摘ください。 11ty とは シンプルな静的サイトジェネレータです。 古くて温もりのある Jekyll の代替というのがコンセプトっぽいです。 2023 年 2 月 26 日時点で Github のスター数は 13,285 個で、Jamstack な SSG の中では 15 番目に多いです。(1 位は Next.js の 97,399 個、因縁の Jekyll は 4 位で 45,69
Vite V4に対応しました (2022-12-24) Rollup 3 の破壊的変更の影響で vite-plugin-imagemin-cache のディレクトリ構造再現オプションが廃止されました 概要 ソースの物量に関わらず瞬時に起動する開発サーバに惹かれて Vite を古典的な従来型静的Webサイトの開発環境に利用しようとしたものの、今時のSPA/MPAがターゲットのためそのようなナレッジもプラグインもほぼほぼ存在せず、「なければ作ればいい」を地で行く羽目になった、というオチ。 Pug+SCSS+TypeScriptとimageminを使用して基本的な従来型静的サイトの制作要件に対応するため、以下のプラグインを作成した。 Pugを静的HTMLとして配信・出力する vite-plugin-pug-static プラグイン ビルド対象をglobパターンで取得する vite-plugin-
※本記事はejsを利用していません。 代わりにHTMLファイルをejsと同等の機能を追加する(ハンドルバー化する)プラグイン vite-plugin-handlebars を利用しています。ejsは以下プラグイン vite-plugin-ejs を利用すると実装できるようです。 github.com GitHub – trapcodeio/vite-plugin-ejs: Vite: Use Ejs in your entypoints i.e index.html Vite: Use Ejs in your entypoints i.e index.html. Contribute to trapcodeio/vite-plugin-ejs …
【Oracle Cloud ウェビナー】基幹システムのクラウド化は可能か?失敗しないための検討ポイントと規模別事例をご紹介
// A: そのまま残る import { Foo } from "./foo"; // B: 識別子 `Foo` が削除される import {} from "./foo"; // C: import 文ごと完全に削除される どれになるかは、以下の状態の組み合わせ依存する(他にも条件あるかも)。 そのファイルでFooが値として参照されるか、型として参照されるか、参照されないか Fooがfoo.tsで値として定義されているか、型として定義されているか tsconfig のオプション設定 importsNotUsedAsValues: 値として参照されない import 文を残すかどうか preserveValueImports: 参照されない import 識別子が値なら残す isolatedModules: ファイル単位でトランスパイルする 上記は出力するモジュール形式が ESM の場合
This Stage 3 proposal is experimental. Do try it and report bugs; don't use it in production! Temporal 注: このドキュメントは原文を部分的に日本語に翻訳したものです。全てのドキュメント,および最新の内容を確認したい場合は原文を参照してください。 Table of Contents イントロダクション Cookbook API ドキュメント Temporal.now Temporal.Instant Temporal.ZonedDateTime Temporal.PlainDate Temporal.PlainTime Temporal.PlainDateTime Temporal.PlainYearMonth Temporal.PlainMonthDay Temporal.Duratio
npm install の概要 npm install を実行すると、 package.json に記載したパッケージと、 そのパッケージを使用するために必要な関連モジュールをまとめてインストールしてくれる。 なお、この際にpackage-lock.jsonが自動作成され、 実際にインストールされたモジュールのバージョン等が記載される。 package-lock.jsonが存在している状態で再度 npm install を実行した場合、package.json ではなく package-lock.jsonを元にインストールが実行される。 package-lock.jsonの存在意義としては、チームで開発する場合などに関連モジュールのバージョンまで揃えられる、という点が主かと思われる。 そのあたり下記記事様がわかりやすく解説してくださってます。 パッケージのセキュリティに問題がある場合 上記
npmで取得したモジュールの一括更新をしたいpackage.jsonの更新を簡単に行いたいバージョンアップ可能なモジュールを知りたい npmで環境構築するとバージョン情報がpackage.jsonに記載されますよね。 でもフロント界隈の発展速度はとても早く、しばらくすると取得したモジュールのバージョンが古くなってしまいます。 そんな時にモジュールのバージョンアップを行うのですが、今回はnpm-check-updatesを使って、package.jsonに記載されているライブラリのバージョンを簡単に更新する方法を紹介したいと思います。 npm-check-updatesとは npm-check-updatesとは名前の通り、npmの取得モジュールのアップデートをチェックしてくれるライブラリです。 チェックだけではなく、package.jsonの内容を一括で更新することも可能で、モジュールのア
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く