如何在React/ES6项目中修改moment.js的locale并解决日期解析报错？

问题原因 #

你的错误和locale设置本身无关，核心是Moment对非标准日期字符串的默认解析规则不匹配你的输入格式：
当你直接向moment()传入DD/MM/YYYY格式的字符串时，Moment会优先用ISO 8601标准尝试匹配，匹配失败后就会回退调用浏览器原生的Date构造函数解析，不同浏览器对非标准日期格式的解析逻辑不一致，所以才会返回Invalid Date。

你误以为设置en-gb locale会自动让Moment按DD/MM/YYYY解析输入，这是常见误区：Moment的locale配置默认仅影响输出格式（比如本地化的月份/星期名称、format('L')这类别名的输出规则），不会修改无格式指定时的输入解析逻辑。

修复方案 #

• 最稳妥的解决方式是解析时明确指定输入格式，修改代码如下：

import moment from 'moment';
import 'moment/min/locales';

moment.locale('en-gb');
// 第二个参数传入输入的日期格式
moment('31/08/2021', 'DD/MM/YYYY').format('YYYY-MM-DD') 

• 如果需要批量适配en-gb的输入解析规则，可以开启Moment的严格解析模式并绑定locale对应的格式规则，不过单场景下更推荐上面的显式指定格式方案，兼容性更高也没有隐式逻辑。

内容的提问来源于stack exchange，提问作者Aakash Verma