使用 Vite + moment 开发时,日期选择器无法正常国际化,可能是你使用了import 'moment/locale/zh-cn' 直接从 /locale 文件夹引入的翻译包的缘故,改成import 'moment/dist/locale/zh-cn' 从 /dist 文件夹引入翻译文件就可以了
// import 'moment/locale/zh-cn';import 'moment/dist/locale/zh-cn'; // 使用 moment/src/locale/zh-cn 下的中文包也可以
究其原因,我们先打开这两份翻译包对比一下他们的区别:
先看看moment\locale\zh-cn.js,我们看到这是一个 umd 的版本:
// moment\locale\zh-cn.js;(function (global, factory) {typeof exports === 'object' && typeof module !== 'undefined'&& typeof require === 'function' ? factory(require('../moment')) :typeof define === 'function' && define.amd ? define(['../moment'], factory) :factory(global.moment)}(this, (function (moment) { 'use strict';//! moment.js locale configurationvar zhCn = moment.defineLocale('zh-cn', {months: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('_'),monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),weekdays: '星期日_星期一_星期二_星期三_星期四_星期五_星期六'.split('_'),weekdaysShort: '周日_周一_周二_周三_周四_周五_周六'.split('_'),weekdaysMin: '日_一_二_三_四_五_六'.split('_'),longDateFormat: {...},meridiemParse: /凌晨|早上|上午|中午|下午|晚上/,meridiemHour: function (hour, meridiem) {...},meridiem: function (hour, minute, isLower) {...},calendar: {...},dayOfMonthOrdinalParse: /\d{1,2}(日|月|周)/,ordinal: function (number, period) {...},relativeTime: {...},week: {...},});return zhCn;})));
再来看看moment\src\locale\zh-cn.js,显然是一个 esm 依赖:
// moment\src\locale\zh-cn.jsimport moment from '../moment';export default moment.defineLocale('zh-cn', {months: '一月_二月_三月_四月_五月_六月_七月_八月_九月_十月_十一月_十二月'.split('_'),monthsShort: '1月_2月_3月_4月_5月_6月_7月_8月_9月_10月_11月_12月'.split('_'),weekdays: '星期日_星期一_星期二_星期三_星期四_星期五_星期六'.split('_'),weekdaysShort: '周日_周一_周二_周三_周四_周五_周六'.split('_'),weekdaysMin: '日_一_二_三_四_五_六'.split('_'),longDateFormat: {...},meridiemParse: /凌晨|早上|上午|中午|下午|晚上/,meridiemHour: function (hour, meridiem) {...},meridiem: function (hour, minute, isLower) {...},calendar: {...},dayOfMonthOrdinalParse: /\d{1,2}(日|月|周)/,ordinal: function (number, period) {...},relativeTime: {...},week: {...},});
那该怎么办呢?我们来看看大佬给出的解决办法:
你懂我...不,你懂他意思吧?