Saturday, December 21, 2024

在 Angular Material 從 Moment.js 轉移到 Luxon

這幾年瀏覽器變很多,連帶的一些本來過去在 Library 做的功能在標準裡面都有相對的替代品,時間相關的部分像是時區以及顯示本地化部分也不例外。

另外就是實作上寫法的問題,現在的 Library 要能夠讓最佳化編譯器可以運作,以便減少下載傳輸量。

曾經處理時間首選就是 Moment.js 函式庫,但時代變了,在 Moment.js 的官網也貼出建議移轉的說明

總之,雖然個人的 Web 前端是湊合著做,不求用到最新的技術。但是終於到了因為 Moment.js 不支援 tree-shaking 而沒辦法簡單無腦 ng update 的時候啊...

npm uninstall @angular/material-moment-adapter
npm uninstall moment
npm install --save luxon
npm install --save-dev @types/luxon
ng add @angular/material-luxon-adapter

程式的部分有相當多的變動,像是在 Luxon 所有物件都是不可變的,所以就不需要 clone 了。轉換日期時間為字串的 format token 也變不少,不過用 Google Gemini 轉效果不錯。

No comments: