2ヶ月前に投稿

Day.js の locale を Update (Plugin の追加)

この記事は約 7 分で読めます。

4.5

前記事では
CDNから日本語のロケールを読み込んで
使用する方法を学びましたが、
今回はデフォルトのロケールを
プラグインを使い Updateしてみます。

CDNでプラグインを追加

以下は、
unpkgのCDNを使って追加しています。

<!-- CDN example (unpkg) -->
<script src="https://unpkg.com/dayjs@1.10.7/dayjs.min.js"></script>
<script src="https://unpkg.com/dayjs@1.10.7/plugin/NAME.js"></script>
<script>dayjs.extend(window.dayjs_plugin_NAME)</script>

localeはdayjs.locale()ですが、
Pluginはdayjs.extend(window.dayjs_plugin_NAME)
「NAME」にPluginの名前を書きます。
ちなみにwindowは省略してもよいようです。

locale の Update

ここでは
日本語 (ja) のlocaleを使わずに、
デフォルト (英語)のlocaleを Updateします。

By default, Day.js comes with English locale only.

UpdateLocale plugin を使う

デフォルトのロケールをUpdateするには
UpdateLocale plugin を使用します。

<script src="https://unpkg.com/dayjs@1.10.7/plugin/updateLocale.js"></script>
dayjs.extend(window.dayjs_plugin_updateLocale);
dayjs.updateLocale('en', {
 /*  Updateするロケールの配列 */
});

デフォルトでは
英語のロケールなので、
updateLocale('en')と「en」でよいみたいです。
Update するロケールの配列を書きます。

5つの locale を Update

  1. Month Abbreviations (月の略語)
  2. Month Names (月名)
  3. Minimal Weekday Abbreviations (曜日の最小略語)
  4. Weekday Abbreviations (曜日の略語)
  5. Weekday Names (曜日名)
FormatOutputDescription
MM01 – 12The month, 2-digits (※ Default)
MMM大寒 – 冬至Month Abbreviations (monthsShort)
MMMM睦月 – 師走Month Names (months)
ddSol – SaturnusMinimal Weekday Abbreviations (weekdaysMin)
ddd太陽 – 鎮星Weekday Abbreviations (weekdaysShort)
dddd日曜日 – 土曜日Weekday Names (weekdays)
List of formats

Month Names / Month Abbreviations

months和風月名
monthsShort二十四節気を入れてみました。

months: ["和風月名"],
monthsShort: ["二十四節気"]

日本の旧暦では、
和風月名わふうげつめいと呼ばれる月の和風の呼び名を使用していました。
日本古来の月の呼び名として
現在もカレンダーなどで見かけます。

二十四節気にじゅうしせっきは、
立春、春分、夏至など季節を表す言葉として用いられています。
1年を春夏秋冬の4つの季節に分け、
さらにそれぞれを6つに分けたもので、
「節または節気」と
「気(中または中気とも呼ばれる)」が交互にあります。

 months: ["睦月", "如月", "弥生", "卯月", "皐月", "水無月", "文月", "葉月", "長月", "神無月", "霜月", "師走"],
 monthsShort: ["大寒", "立春", "春分", "清明", "立夏", "夏至", "大暑", "立秋", "秋分", "寒露", "立冬", "冬至"]
数字月 (2桁)和風月名二十四節気
01睦月 (むつき)大寒 (中気)
02如月 (きさらぎ)立春「四立 (しりゅう)」
03弥生 (やよい)春分 (二分)
04卯月 (うづき)清明 (節気)
05皐月 (さつき)立夏「四立 (しりゅう)」
06水無月 (みなづき・みなつき)夏至 (二至)
07文月 (ふみづき・ふづき)大暑 (中気)
08葉月 (はづき・はつき)立秋「四立 (しりゅう)」
09長月 (ながつき・ながづき)秋分 (二分)
10神無月 (かんなづき)寒露 (節気)
11霜月 (しもつき)立冬「四立 (しりゅう)」
12師走 (しわす)冬至 (二至)
Month Names / Month Abbreviations

二十四節気を12月に
分けるには、24等分
のうち八節と、
中気を2つ (大寒・大暑)
節気を2つ (清明・寒露)
の計12月としました。

八節はっせつとは、
重要な中気である夏至・冬至の二至、
春分・秋分の二分を併せて二至二分にしにぶんと言い、
重要な節気である立春・立夏・立秋・立冬を四立しりゅう
二至二分と四立を併せて八節という。

Weekday Names / Weekday Abbreviations / Minimal Weekday Abbreviations

FormatOutputDescription
ddddSunday-SaturdayThe name of the day of the week
Default Format

デフォルトのlocaleで曜日名 (weekdays) は
英語表記なので日本語の各曜日に Updateします。

weekdaysShort七曜星を入れ、
この7つの天体を象徴する
ローマ神話の神々の名前を
weekdaysMinに入れてみました。

weekdays: ["日本語曜日"],
weekdaysShort: ["七曜星"],
weekdaysMin: ["神話神"]

七曜しちようは、
五惑星 (火星・水星・木星・金星・土星)と
太陽 (日) と太陰 (月)を併せたもので、
七曜星とも言う。

 weekdays: ['日曜日', '月曜日', '火曜日', '水曜日', '木曜日', '金曜日', '土曜日'],
 weekdaysShort: ['太陽', '太陰', '熒惑', '辰星', '歳星', '太白', '鎮星'],
 weekdaysMin: ["Sol", "Luna", "Mars", "Mercurius", "Jupiter", "Venus", "Saturnus"]
 七曜星【日月五星】ローマ神話の神
日曜日太陽【日】Sol (ソル): 太陽神
月曜日太陰【月】Luna (ルナ): 月の女神
火曜日熒惑【火星】Mars (マルス): 軍神
水曜日辰星【水星】Mercurius (メルクリウス): 知恵の神
木曜日歳星【木星】Jupiter (ユピテル): 天空神
金曜日太白【金星】Venus (ウェヌス・ヴィーナス): 愛と美の女神
土曜日鎮星【土星】Saturnus (サトゥルヌス): 農耕神
Weekday Names / Weekday Abbreviations / Minimal Weekday Abbreviations

結果

Result

Resource

<!-- CDN example (unpkg) -->
<script src="https://unpkg.com/dayjs@1.10.7/dayjs.min.js"></script>
<script src="https://unpkg.com/dayjs@1.10.7/plugin/updateLocale.js"></script>

HTML

<div id="fmtdate"></div>

JavaScript

参考文献

最後に

貴重なお時間を割き、
最後まで
ご高覧いただきまして
有難うございました

Day.js の locale を Update (Plugin の追加)