🔖

Angular 19 へのアップデート後に MatDatepicker の No provider found エラーが出た話

に公開2

🧩 はじめに

Angular を 18 → 19 にアップデートしたところ、
バージョン 18 のまま使っていた @angular/materialMatDatepicker で以下のようなエラーが発生しました。

❗ 発生したエラー

Component update failed: MatDatepicker: No provider found for DateAdapter.  
You must add one of the following to your app config: provideNativeDateAdapter, provideDateFnsAdapter, provideLuxonDateAdapter, provideMomentDateAdapter, or provide a custom implementation.

このエラーはビルド時には発生せず、実行時にブラウザのコンソールに表示されたことで気がつきました。これにより、DatePicker が使われているページが表示されなくなり、アプリの一部機能に支障が出る状態となっていました。

📦 試したこと

  • package.json の依存関係を確認 → 問題なし
  • node_modules/ を削除して npm install → 効果なし
  • ts ファイル内に provideNativeDateAdapter() を明示している → 効果なし

✅ 最終的な解決方法

プロジェクトフォルダ内にある、.angular/cache/の中身を削除して再ビルドしたところ、エラーが解消されました。

rm -rf .angular/cache/*
ng build

※追記:Angularのキャッシュクリアコマンドで実施する方が確実

ng cache clear

Angular 19 へアップデートした際に、内部のビルドキャッシュが壊れた状態で保持されていたのかもしれません。
.angular/cache は再ビルド時に自動で再生成されるため、削除による影響はありませんでした。

🚀 まとめ

  • Angular 19 への移行後、MatDatepicker のプロバイダエラーが出ることがある
  • コードや依存関係に問題がない場合でも、.angular/cache を削除してみると解決することがある
  • Angular のメジャーアップデート後はキャッシュのクリアを習慣にしておくとトラブル回避につながる

Discussion

buko106buko106

angularのビルドキャッシュ削除する ng cache clean というコマンドもあります(キャッシュのディレクトリを変更する設定もあったりします)

https://angular.jp/cli/cache

ss

ありがとうございます!解決したことに満足して調査が及んでいませんでした・・・!
教えていただいたコマンドでも同様にキャッシュファイルが削除されることも確認しました。
こちらのコマンドで実施した方が確実ですね。