Moment: で、で-米国ローカル

enロケールがあり、別のファイルには含まれていません。 moment().locale()とmoment.locale()に非常に受け入れられています：

moment.locale('fr')
"fr"
moment().format("LLLL")
"vendredi 25 novembre 2016 03:39"
moment.locale('en')
"en"
moment().format("LLLL")
"Friday, November 25, 2016 3:39 AM"

en-US機能します。これは、特定性の低い一致を検索し、 enロケールが米国英語であるためです。

moment.locale('en-GB')
"en-gb"
moment().format("LLLL")
"Friday, 25 November 2016 03:40"
moment.locale('en-US')
"en"
moment().format("LLLL")
"Friday, November 25, 2016 3:40 AM"

私はそれを購入しません。 ロケールが環境から検出され、moment / locale / $ {detectedLocale}をロードするためにrequiredepパスが構築される場合を考えてみます。 その変数が「en」または「en-us」の場合、requirejsはファイルのロードに失敗します（404を取得します）。 'de'として検出された場合、ファイルがロード

@eigood Momentのロケールローダーは、すでに英語が使用されていることを認識しており、外部ファイルからロードしようとはしません。

@icambronユーザーがロケールとして「en-US」を渡したときにツリーを歩くことについてあなたが正しいとは思いません。 実際、私は現在それをデバッグしていますが、あなたが木を歩いていないので壊れています。
私のユースケースは、moment.utc（myDate、myFormat、locale、true）を呼び出している場合です。ここで、localeは単一の文字列 'en-US'です。 その文字列はインポートできませんが（ファイルがないため）、配列ではないため、ロケールを要求しようとし、本番環境で中断します。
本当の最善の動作は、デフォルトで存在するロケールのリストに実際にen-USを含めることであるように思われます（現在は存在せず、enだけです）。

@steveccableええと、より具体的なローカリゼーションがあった場合に備えて、ロードしようとします。 失敗すると、「en」だけを試行して成功します。 切断は、どういうわけか「en-US」のロードに失敗したことが原因だと思います。 ここでは何も爆発することはありません。 正常に失敗し、次のオプションに移動することになっています。 それで、あなたはあなたの環境についてもっと私に話さなければならないでしょう：具体的には何が間違っているのですか？

@icambron私の環境は、npmを使用して依存関係を制御するReact Nativeアプリケーションであり、最小限のサンプルアプリケーションでも障害を再現することができました。 問題は、loadLocale関数で、nameがen-USであるrequire（ './ locale /' + name）を試行し、requireが失敗することです。 そのrequireがリリースビルドで失敗すると、アプリは次の行に沿ったスタックトレースでクラッシュします。

E/ReactNativeJS: Requiring unknown module "./locale/en-us".
E/AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
                                                                Process: com.myApp, PID: 30054
                                                                com.facebook.react.common.JavascriptException: Requiring unknown module "./locale/en-US"., stack:
                                                                o<strong i="7">@2</strong>:742
                                                                n<strong i="8">@2</strong>:426
                                                                i<strong i="9">@2</strong>:278
                                                                t<strong i="10">@2</strong>:210
                                                                Xe<strong i="11">@648</strong>:16702
                                                                nt<strong i="12">@648</strong>:17804
                                                                gt<strong i="13">@648</strong>:22583
                                                                yt<strong i="14">@648</strong>:22460
                                                                wt<strong i="15">@648</strong>:23200
                                                                c<strong i="16">@648</strong>:1112
                                                                parse<strong i="17">@645</strong>:1536
                                                                render<strong i="18">@643</strong>:2923
                                                                _renderValidatedComponentWithoutOwnerOrContext<strong i="19">@141</strong>:7295
                                                                _renderValidatedComponent<strong i="20">@141</strong>:7462
                                                                performInitialMount<strong i="21">@141</strong>:3012
                                                                mountComponent<strong i="22">@141</strong>:2056
                                                                mountComponent<strong i="23">@132</strong>:205
                                                                performInitialMount<strong i="24">@141</strong>:3162
                                                                mountComponent<strong i="25">@141</strong>:2056
                                                                mountComponent<strong i="26">@132</strong>:205
                                                                performInitialMount<strong i="27">@141</strong>:3162
                                                                mountComponent<strong i="28">@141</strong>:2056
                                                                mountComponent<strong i="29">@132</strong>:205

コードを見ると、getLocaleは私のキー（「en-US」）が配列ではないことを認識しているため、「en」と一致させようとせずにloadLocaleに分類されます。これは、chooseLocale関数に入る場合にのみ発生します。

編集：chooseLocale関数をもう少し詳しく調べた後でも、最初に「en-US」を選択しようとし、次に「en」を試す前にrequireに失敗するため、requireが失敗するとアプリがクラッシュします。これが配列の場合。
また、それが壊れている場所がトライ/キャッチの内側にあるという事実も奇妙ですが、とにかくクラッシュを引き起こします。 それは実際にここで本当に困惑することです。

編集2：デバッグ（__DEV__）ビルドでは、requireが正常に失敗し、その後、「en」を使用することになります。 requireが__PROD__でこれほど爆発的である理由はわかりませんが、ここでは間違いなく瞬間的に壊れています。

編集3：require jsのドキュメントから、「依存関係を表現しないと、RequireJSがスクリプトを非同期にロードし、速度が低下するため、ロードエラーが発生する可能性があります。」 したがって、try / catchは同期エラーにのみ役立つため、try / catchが実際にここに保存される可能性はほとんどありません。

したがって、少し作業した後、（理想的とは言えない）回避策があります。 基本的に、コードが「en-US」のロケールを渡そうとするときはいつでも、それをインターセプトして、代わりに「en」のロケールを渡します。 他のロケールは変更せずに通過できます。

とはいえ、en-USが見つからないことや、デフォルトですでにあることはまだ問題だと思います。実際に呼び出されたときに見つからないことを避けるために、他のロケールのように具体的に含めることはできません。に。

@steveccable

また、それが壊れている場所がトライ/キャッチの内側にあるという事実も奇妙ですが、とにかくクラッシュを引き起こします。 それは実際にここで本当に困惑することです。

そうです、それが私が言っていることです。 失敗したrequire呼び出しが壊滅的である理由を理解しようとしています。 en-US知識でハードコーディングするのは助けになりません; 他のフォールバックの場合でも、同様の障害が発生します。 つまり、これはenが特殊なケースであることとは関係ありませんが、フォールバックプロセスが環境でまったく機能していないことと関係があります。

それを処理してみると、ReactNativeは失敗した要求を私たちが望むように優雅に処理していないようです。 enが特別な場合であることに関係がないことは正しいですが、それが特別であると思われた唯一の理由は、en-USのrequireが失敗するのを防ぐ方法がなかったためです（直接インポートできないため）他のロケールと同様）。 後の編集で説明したように、try / catchは非同期で失敗するため、機能しません。
今のところ、「en-US」のロケールをサニタイズするという上記の回避策は、私の目的には有効です。

非同期で失敗するため、try / catchは機能しません

ああ、私はその編集を逃しました。 それも私の推測でした。

@steveccable
それでも問題が発生するかどうかはわかりませんが、リリースビルドでまったく同じクラッシュが発生しました（ただし、フランス語のロケールでは）が1日かかりました😢

E/ReactNativeJS: Requiring unknown module "./locale/fr".
(...)

私はそれを解決しました：

import 'moment/locale/fr';

多分それは役立ちます

ロケール入力をサニタイズする回避策は問題ありませんが、react Native require（）がどこでも非同期に失敗する可能性があり、それをキャッチする方法がないことを知るのは本当に怖いです。 また、存在しないロケールまたはランダムな文字列（たとえば、「blah-Blah」）を送信すると、アプリがクラッシュし、どこでもエラーを処理できなくなります。 だから私は、誰もこのバグを引き起こさないことを防御的にチェックする必要があります。

バージョン2.19.2以降で問題が発生しました。このリリースで変更された内容は次のとおりですhttps://github.com/moment/moment/compare/29afed6...328d51e関数updateLocaleがloadLocaleを内部で使用し始め、動的文字列httpsでrequireを使用しました

変数https://github.com/facebook/react-native/issues/6391でファイルを動的に要求できないため、これはネイティブの反応に失敗すると思い

私の特定のケースでは、en-gbファイルをインポートしているので、moment.localeを呼び出すまでにlocales[name]にあるはずです。 なぜそれが必要になるのかわかりません。

RNが優先事項であるかどうかはわかりませんが、RNの瞬間は数か月間壊れます。

これらすべてを考慮すると、facebook＃69がすべての人のブロックを解除するための最も生産的な修正であるように思われます。 @jeanlauliacと話をして、月曜日にマージできるかどうかを確認します。

背景を説明するために、動的依存関係をサポートしない理由は複数あります。 まず、動的にモジュールを必要とする場合、静的分析が機能しなくなります。 次に、動的要求を使用する場合、探している実際のモジュールが使用できない場合があります。 これにより、Facebookを壊すなど、ユーザーがアプリを使用できなくなるような大きな問題が本番環境で発生する可能性があります。 私たちは過去にこのような問題を抱えていたので、対処するのは楽しいことではありません。 Metroは、ユーザーがユーザーに苦痛を与えるようなことをしないように意図的に考えられています。

最後に、このオープンソースリポジトリは現在、良好な状態ではないことを理解しています。 良いニュースは、FBでMetroに取り組んでいる人がこれまでになく増えたことです。また、Metroを大幅に改善するために、店舗に多くの大きな変更がありますが、悪いニュースは、関係のない作業を行う必要がある差し迫った問題があることです。オープンソースに。 数か月以内にこのリポジトリがはるかに良い状態になり、貢献しやすくなることを願っています。 しばらくお待ちください。

RNの場合、ロケールの最初の部分（おそらく、「xx-XX」ロケールのロードに失敗したときに画面の背後でどのような瞬間が発生するか）を削除することで、リリースモードで動作するようになりました。 次のスニペットでは、 localeは「xx-XX」の形式のデバイスのロケールです。

moment.locale(locale.indexOf("-") === -1 ? locale : locale.substr(0, locale.indexOf('-')))

これは奇妙な振る舞いです。

https://stackoverflow.com/a/47260841/175825エコシステムがそれらを消費できるようにするには、特定のロケールをインポートする必要があります。

この魔法のせいで、react-big-calendarにmm/yyを使用してBigCalendar.momentLocalizer() mm/yyような日付を表示させることはできません。これは、ロードされるロケールを想定しているためです。

私はreact-big-calendarで問題を開くことができましたが、特定のロケールを期待している次のライブラリについてはどうでしょうか？ そして次は？

en-usロケールを追加するだけで、デフォルトはマジックになります。

en-usロケールを追加し、デフォルトでマジックに設定するだけです。

それは問題を解決しません。自動フォールバックを行うスペイン語（ es-ES => es ）のような言語があります。

まだ解決策を探している人にとって、これは問題を軽減するのに役立つかもしれませんが（いくつかのエッジケースを除いて）、try-catchの間にクラッシュを引き起こすRNの根本的な問題を修正しませんrequire ：

import moment from 'moment/min/moment-with-locales.min.js';

// locale is the locale detected by react-native-device-info
// ts is the time
export const formatTime = (locale, ts) => {
const m = moment.utc(ts);
locale = chooseMomentLocale(locale);
m.locale(locale);
// other logic to determine whether to show the time as "9:43 pm", "yesterday", or "7/8/2018"

return formattedTime;
}

/**
 * Checks if the device locale is available in moment and returns the locale to be loaded
 * <strong i="7">@param</strong>  {string} locale locale to be checked
 * <strong i="8">@return</strong> {string}        locale to be loaded by moment
 */
const chooseMomentLocale = (locale) => {
  // make the locale lower case 
  // will fix crashes caused by "en-GB" (instead of "en-gb") not being found
  locale = locale.toLowerCase();  
  if (moment.locales().includes(locale)) { // check if the locale is included in the array returned by `locales()` which (in this case) tells us which locales moment will support
    return locale;
  } else if (moment.locales().includes(locale.substring(0, 2))) { 
    // check if the first two letters of the locale are included in the array returned by `locales()` which (in this case) tells us which locales moment will support
    // will fixes crashes caused by "en-US" not being found, as we'll tell moment to load "en" instead
    return locale.substring(0, 2);
  }
    // use "en-gb" (the default language and locale for my app) as a fallback if we can't find any other locale
    return 'en-gb'; 
};

また、React Nativeを使用してこの問題を経験し、Momentと一緒にすべてのロケールを含めることで、この問題を回避することができました。

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

（または、 moment/min/moment-with-localesも提供されていますが、他の一部のフォーマッターとは互換性がありませんでした。）

これは非常に厄介な問題です。

あなたがそれについて考える必要さえないロケールの全体のポイントではなく、あなたが米国にいるという理由だけであなたのコードに「en-US」をハードコーディングしていないことは確かですか？ 'en-US'のロケールを要求するときに、それを取得できない理由がわかりません。 人々に頭痛の終わりを引き起こしません。

私は1年前にこの問題を解決しましたが、その方法を完全に忘れてしまい、最初からやり直す必要があります。 （私はAngularで日付ピッカーを使用していて、最小限の実装を入れるだけでこのエラーが発生します）。

日時ピッカーを使用しようとして、Angularでこれを取得しています。 LOCALEをen-GBのようなものに設定すると、正常に機能しますが、何も指定しなくてもこれを取得できます。 これを修正する適切な方法を見つけられたらいいのにと思います

RNの場合、ロケールの最初の部分（おそらく、「xx-XX」ロケールのロードに失敗したときに画面の背後でどのような瞬間が発生するか）を削除することで、リリースモードで動作するようになりました。 次の抜粋では、 localeは「xx-XX」の形式のデバイスのロケールです。

moment.locale(locale.indexOf("-") === -1 ? locale : locale.substr(0, locale.indexOf('-')))

このソリューションは、次のようにi18nとmomentjs機能します。

// imports:
import moment from 'moment';
import i18n from './i18n';
import 'moment/locale/fr';

// constructor: 
moment.locale(i18n.locale.indexOf('-') === -1 ? i18n.locale : i18n.locale.substr(0, i18n.locale.indexOf('-')));

私はまだバージョン "moment"を実行してこの問題を実験しています： "^ 2.22.2"、
前回のバージョンでの修正はありますか？

この問題についてチャイムを鳴らします。

1. en-USを他の隠されたデフォルトの異なるものとして扱うことは悪い設計です。
2. en-usロケールがないため、使用するCDNバージョンがわかりません。
3. 瞬間は印象的ですが、en-USが他のロケールと同じでないことは悪いコードの臭いであるため、別の解決策を見つけることができません。

また、完璧に機能する素晴らしい開発を構築した後、本番環境でのreact-nativeでこのエラーが発生しました。
@adesmetが提案したソリューションと次のリファクタリングで解決しました。

function parseLocaleForMoment (language) {
  if (language.indexOf('-') === -1) return language
  else return language.substr(0, language.indexOf('-'))
}

RNは非常に瞬間的に吸うように見えるので、ネイティブフォーマッターを作成する方が簡単です。 おそらくたった1行のコードで、防弾が機能します。

このように修正することになりました：

const subLocales = [
  'ar-tn',
  'ar-dz',
  'ar-kw',
  'ar-ma',
  'ar-sa',
  'ar-ly',
  'de-at',
  'de-ch',
  'en-sg',
  'en-au',
  'en-ca',
  'en-gb',
  'en-ie',
  'en-nz',
  'es-us',
  'es-do',
  'fr-ca',
  'fr-ch',
  'gom-latn',
  'hy-am',
  'pa-in',
  'pt-br',
  'sr-cyrl',
  'tl-ph',
  'tlh',
  'tet',
  'ms-my',
  'it-ch',
  'tzl',
  'tzm',
  'tzm-latn',
  'nl-be',
  'ug-cn',
  'uz-latn',
  'zh-cn',
  'zh-hk',
  'zh-tw'
];

let momentLocale = i18n.locale.toLowerCase();

if (!subLocales.includes(momentLocale)) {
  momentLocale = momentLocale.substring(0, 2);
}

moment.locale(momentLocale);

悲しいことに、react native @tapzを使用すると、これはAndroidで機能するようですが、iOSでは悲しいことに：/何らかの理由でzhロケールで問題が発生しています：/

これは、簡体字と従来型を区別するために、zhと他のいくつかのロケールの形式が異なるためである可能性があります。 https://gist.github.com/jacobbubu/1836273を参照して

@ rajivshah3確かに私はtapxメソッドで動作していなかったzh_Hant_HKを持っていました私は今あなたの投稿のおかげでこの問題にできるだけスムーズに対処するための最良の方法のように見えるあなたのメソッドを使用しています👍

RNプロダクションモードでのみ同じ問題。

これは私にとってはうまくいくようです。

import 'moment/locale/fr';
import 'moment/locale/es';
import 'moment/locale/de';
import 'moment/locale/en-gb';
import 'moment/locale/es-us';

const toMomentLocale = locale => {
  let momentLocale = locale;
  momentLocale = momentLocale.replace('_', '-').toLowerCase();
  momentLocale = ['en-gb', 'en-us'].includes(locale)
    ? momentLocale
    : momentLocale.split('-')[0];
  return momentLocale;
};

データがインポートされ（またはen ）、ケースを尊重している限り、問題なく機能しているようです。

これは本当にばかげています。 言語コードの-regionセクションを削除することは、解決策ではありません。

1）ロケールの地域固有性が失われます。
2）さらに悪いことに、そのメソッドはさらにクラッシュを引き起こします。 たとえば、中国語（ zh ）は、MomentJSロケールにも存在しません。 zh-cn 、 zh-hk 、およびzh-twのみが定義されています。 したがって、上記のコードを使用してロケール文字列からリージョンを削除すると、ほとんどの中国のデバイスでアプリがすぐにクラッシュします。 わずか8億人のスマートフォンユーザー。

React Nativeの一時的な（そして完全にばかげた）回避策は次のとおりです。

const locale = 'zh-cn'; // or en-US etc
const languageCode = moment.locale(locale.indexOf("-") === -1 ? locale : locale.substr(0, locale.indexOf('-'))); // now 'zh', 'en' etc. Thanks <strong i="14">@adesmet</strong> 
let momentJsLocale;
switch(languageCode.toLowerCase()) {
  case 'zh':
    // No 'zh' locale exists in MomentJS. App will crash in production if used.
    momentJsLocale = 'zh-cn';
    break;
  case 'pa':
    momentJsLocale = 'pa-in';
    break;
  case 'hy':
    momentJsLocale = 'hy-am';
    break;
  default:
    momentJsLocale = languageCode.toLowerCase();
}
moment.locale(momentJsLocale);

@adammcarthこんにちは、RNのロケール修正の瞬間についてのニュースはありますか？

これは、 en-gbを使用しているリリースビルドでクラッシュしました。

と同様の問題が発生します。 @simeyla 。

Luxonをタイムピッカーと一緒に追加すると、問題が発生し、「en-US」ロケールに関連しているように見えます。

@steveccableええと、より具体的なローカリゼーションがあった場合に備えて、ロードしようとします。 失敗すると、「en」だけを試行して成功します。 切断は、どういうわけか「en-US」のロードに失敗したことが原因だと思います。 ここでは何も爆発することはありません。 _正常に失敗することになっています_そして次のオプションに移動します。 それで、あなたはあなたの環境についてもっと私に話さなければならないでしょう：具体的には何が間違っているのですか？

'en-US'または例外を伴う他の有効なロケールの処理に関する別の問題は、デバッグ中にデバッガーに例外のブレーキをかけるように要求すると、これに繰り返しスタックすることです。

特に「en-US」のような大規模なロケールでは、より適切で簡単な方法があるはずです。
最終的には、速度を考慮するために、大勢のユーザー/使用の可能性があるこれらのロケールを事前にチェックして処理する必要があります。

@slorberのソリューションをより堅牢になるように変更しました。 これにより、着信ロケール（たとえば、「zh_CN」から「zh-cn」）が再フォーマットされ、その瞬間のインストールでサポートされているかどうかがチェックされ、国にフォールバックしてから、en-usにフォールバックします。

const toMomentLocale = (locale) => {
  let newLocale = locale.replace('_', '-').toLowerCase();
  let tryLocales = [newLocale, newLocale.split('-')[0]];
  for (let i = 0; i < tryLocales.length; i++) {
    if (moment.locales().indexOf(tryLocales[i]) >= 0) return tryLocales[i];
  }
  return 'en-us';
};

// use it like this:
let m = moment();
m.locale(toMomentLocale('zh_CN')).format('LLL'); // "2019年12月11日上午9点33分" -- used "zh-cn"
moment.locale(toMomentLocale('ja_JP'));
moment().format('LLL') // 2019年12月11日 09:34 -- falls back to "ja"

同じ問題が、RN実稼働IOSモードでのみ発生します。

これは私にとってはうまくいくようです。

「瞬間」から瞬間をインポートします。
import'moment / locale / es ';

これをデバッグするのにかなりの時間を費やしました、これをありがとう@jorodriguez

これはまだ問題です😢

こんにちは、みんな、

私はあなたのために小さなパッケージを作成しました-> https://github.com/tonix-tuft/moment-utl

npm install --save moment moment-utl

以下を使用して、事前にロードしなくても、サポートされているすべての瞬間のロケールを判別できます。

import { allSupportedLocales, allSupportedLocalesMap } from "moment-utl";

const locales = allSupportedLocales(); // As an array: ["af", "ar", "ar-dz", "ar-kw", "ar-ly", "ar-ma", "ar-sa", "ar-tn", "az", "be", "bg", ...,  "en", ..., "zh-tw"]

const localesMap = allSupportedLocalesMap(); // As an object: { "af": 1, "ar": 2, "ar-dz": 3, "ar-kw": 4, "ar-ly": 5, "ar-ma": 6, "ar-sa": 7, "ar-tn": 8, "az": 9, "be": 10, ..., "en": 27, "zh-tw": 128 };

moment-utlピアはmomentに依存しますが、すべてのmomentロケールをバンドルします
moment dev依存関係パッケージのビルド中にmoment/localeディレクトリからそれらを取得します。

ただし、 momentはピアの依存関係であるため、ES6を使用していて、 allSupportedLocalesとallSupportedLocalesMap両方がmoment最新のロケールを使用していることを確認したい場合moment-utlと一緒にプロジェクトにインストールしたmomentバージョン（たとえば、 momentがいつか新しいロケールを追加した場合、これでカバーできるはずです）、を使用してそれらのロケールを再生成することもできます。 moment-utl-locales moment-utlによって提供されるmoment-utl-localesスクリプト。

npxコマンドで使用できます。

npm install -g npx    # Install npx if you don't have it yet
npx moment-utl-locales    # Run this command from your project's root folder

このスクリプトを使用するときは、コードをRollupまたはWebpack（どちらを使用するか）でバンドルする前に必ず実行してください。そうすれば、バンドラーがそれらに遭遇して追加する前に、最新のロケール配列とオブジェクトが生成されます。最終的なバンドル。

これがお役に立てば幸いです。

@adammcarthへの返信として、ここで私の回答を確認してください： https ：

この問題はOdooの人々を悩ませてきました。提案された修正は、en-usファイルを手動で作成することでした。 はぁ。

私が理解していないのは、上記のコメントで述べたように、ローダーがすでに「en」を持っていることを認識し、動的にインポートしない場合に、momentがen-usファイルをロードしようとする理由です。

とにかく、それはまだRNユーザーにとって悪夢です。 最悪の部分は、問題が本番ビルドでのみ発生することです。

隠されたデフォルトを持つことは驚きのパッケージです...

この問題はOdooの人々を悩ませてきました。提案された修正は、en-usファイルを手動で作成することでした。 はぁ。

私が理解していないのは、上記のコメントで述べたように、ローダーがすでに「en」を持っていることを認識し、動的にインポートしない場合に、momentがen-usファイルをロードしようとする理由です。

とにかく、それはまだRNユーザーにとって悪夢です。 最悪の部分は、問題が本番ビルドでのみ発生することです。

隠されたデフォルトを持つことは驚きのパッケージです...

私はこれのために👎を取得するつもりですが、私の解決策はmomentをdayjsに交換することfind all + replace allと同じくらい簡単でした。

これを検討したいと思うかもしれない人々のために私がしたことを共有するだけです。