TypeScript学習備忘録_2026年11月7日
💡 注意
作った日報作成ツールに過去の私の記事を食わせてそのまま乗っけたものになります
完全AI出力(無料版)ですので、ハルシネ祭りかもです
自動でQiita記事を書いてくれるツールを作ろうと息巻いていましたが、機能を追加していくうちにコードがぐちゃぐちゃになってきました。
二日坊主はよくないので、今日は一旦立ち止まってコードの整理（リファクタリング）と、それに伴って受けたTypeScriptの洗礼についてまとめていきます。
復習がてら、過去のエラーも振り返っていかなきゃですね。
目次
- モジュール分割
- export
- tsconfig.json
1. モジュール分割
- 肥大化した1つのファイルを、役割ごとに複数のファイルに切り分ける仕組み
- 開発の規模が大きくなってくると絶対にお世話になるやつですね
import { getGitDiff } from './git';
import { generateArticle } from './ai';
const main = async () => {
const diff = getGitDiff();
await generateArticle(diff);
};
今まで1つのファイルに「Git取得」「AI生成」「ファイル保存」全部書いていて迷子になりかけていました。
ファイルを分けると、実行する場所（index.ts）が英語の文章みたいにスラスラ読めるようになりますね。
ただ、ファイルを分けた途端に別のエラーが連発して最初は泣きそうになりました。
2. export
- 別のファイルで作った関数を、外から呼び出せるようにする仕組み
- まだちょっと「よっ友状態」で、たまに書き忘れます
// export をつけないと他のファイルから import できない
export const getGitDiff = (): string => {
// 処理...
};
ファイルを分けたはいいものの、この export を書き忘れて「モジュールが見つかりません」とTypeScriptにめちゃくちゃ怒られました。
せっかく関数を作ってスタメンに迎えたいのに、控え室に鍵がかかっていてグラウンドに出られない状態ですかね。
外から呼ぶ関数には必ずつける、と一つ賢くなりました。
3. tsconfig.json
- TypeScriptをJavaScriptにどう変換するか、細かいルールを決める設定ファイル
- まだ完全に理解しきれていない、少し距離のある相手です
{
"compilerOptions": {
"skipLibCheck": true,
"esModuleInterop": true
}
}
設定ファイルがないまま実行したら謎のヘルプ画面が出たり、node_modules の中の無関係なライブラリまでエラー判定されて画面がパンクしたりと散々でした。
正直、中身の細かいプロパティに関しては暗唱できません。
（絶対覚えるべきなんでしょうが、毎日触っている実務さんなら息をするように書けるものとして割り切っています）
特に skipLibCheck はライブラリの不要なエラーを黙らせてくれるので、その時々で調べて実装するのが結果的に一番スムーズかもです。
今回は3つでしたね。
最初は色々と詰め込もうとしていましたが、やっぱり片手くらいで収まるのが僕にはお似合いみたいです。
無事にツールの裏側が綺麗になったので、次はいよいよVS Codeの拡張機能として動かせるように挑戦していきます。
だんだんと内容をしっかり覚えられているかあやふやになる時もありますが、更新は続けつつ、過去記事を見直したうえで書いていきます。
せっかくQiitaにあげているので、その利点を使わな損です。