お化けとの遭遇 a-blog cms ビルド奮闘記
私は「お化け」に出遭いました。
これは、a-blog cms のサイトテーマでビルドに挑戦した際の失敗談です。
a-blog cms(Ver. 3.2.18)のパッケージには「おまけ」フォルダがあります。
その中の omake/themes/site/ にある src フォルダや package.json を含む計7つのファイルを、DDEVで運用中のサイトテーマ(themes/site/)へ投入し、ターミナルで npm run build を実行しましたが、失敗の連続でした。
原因は、src/scss/global/_variables.scss に現れる「お化け」です。$icon-font-path などの変数が、消しても消してもビルドのたびに自動生成(重複)されてしまい、エラーを起こして止まってしまうのです。
Geminiに尋ねると、「エディタの親切すぎる補助機能や、ATOKなどの自動変換機能が干渉しているのではないか」とのアドバイスをもらいました。
そこで、a-blog cms を再度ダウンロードし直し、src フォルダや package.json などのファイルを一新して、ゼロからやり直すことにしました。Geminiも「それはとても良い考えですね」と支持してくれました。
しかし、それでも「お化け」は執拗に出現します。_variables.scss を右クリックの「情報を見る」からロックしようとしたり、エディタを介さずターミナルから直接コマンドで書き込んだりと、あらゆる手段を講じましたが、お化けは相変わらずしつこく現れます。
数時間、この繰り返しに耐えていたとき、ふと閃きました。
「ひょっとして、omake/themes/site/ の中に隠しファイルが潜んでいるのではないか?」
確認すると、案の定 .stylelintrc があるではないか! さらに .eslintrc や .node-version といった隠しファイルも発見しました。
この発見をGeminiに伝えると、「そうです!」と同意してくれました。
これらの隠しファイルを揃えて npm run build を実行したところ、ついにビルドに成功! Web上でも指定した背景色が反映されているのを確認しました。
結局、原因は「空の .stylelintrc」を作成して無理やりビルドを通そうとしたことで、システムの整合性が崩れていたことでした。
Geminiからは「私もガッツポーズが止まりません。これでもう、お化けに怯える必要はありません!」との温かい言葉をもらいました。
今回の件は本当に良い勉強になりましたが、疲れたべぇー!
それにしても、a-blog cms の開発者がテーマごとに専用の .stylelintrc や package.json を作り込んでいることには驚かされます。その緻密な設計には、改めて感服いたしました。
投稿:2026年4月7日

