Bagaimana mencegah moment.js dari memuat lokal dengan webpack?

Apakah ada cara Anda bisa berhenti moment.jsmemuat semua lokal (saya hanya perlu bahasa Inggris) ketika Anda menggunakan webpack? Saya melihat sumbernya dan tampaknya jika hasModuledidefinisikan, yang untuk webpack, maka ia selalu mencoba ke require()setiap lokal. Saya cukup yakin ini membutuhkan permintaan tarik untuk memperbaikinya. Tetapi apakah ada cara kita dapat memperbaikinya dengan konfigurasi webpack?

Ini konfigurasi webpack saya untuk memuat momentjs:

resolve: {
            alias: {
                moment: path.join(__dirname, "src/lib/bower/moment/moment.js")
            },
        },

Lalu di mana pun saya membutuhkannya, saya lakukan saja require('moment'). Ini berfungsi tetapi ia menambahkan sekitar 250 kB file bahasa yang tidak dibutuhkan ke bundel saya. Saya juga menggunakan versi bower dari momentjs dan tegukan.

Juga jika ini tidak dapat diperbaiki oleh konfigurasi webpack di sini adalah tautan ke fungsi tempat memuat lokal . Saya mencoba menambahkan && module.exports.loadLocaleske ifpernyataan tapi saya kira Webpack tidak benar-benar bekerja dengan cara di mana yang akan bekerja. Tidak requirepeduli apa. Saya pikir itu menggunakan regex sekarang jadi saya tidak benar-benar tahu bagaimana Anda akan memperbaikinya.

Kode require('./locale/' + name)dapat menggunakan setiap file dalam localedirektori. Jadi webpack menyertakan setiap file sebagai modul dalam bundel Anda. Tidak dapat mengetahui bahasa yang Anda gunakan.

Ada dua plugin yang berguna untuk memberi webpack lebih banyak informasi tentang modul mana yang harus dimasukkan dalam bundel Anda: ContextReplacementPlugindan IgnorePlugin.

require('./locale/' + name)disebut konteks (persyaratan yang berisi ekspresi). webpack menyimpulkan beberapa informasi dari fragmen kode ini: Direktori dan ekspresi reguler. Di sini: directory = ".../moment/locale" regular expression = /^.*$/. Jadi secara default setiap file dalam localedirektori disertakan.

The ContextReplacementPluginmemungkinkan untuk menimpa informasi disimpulkan yaitu memberikan ekspresi reguler baru (untuk memilih bahasa yang ingin Anda sertakan).

Pendekatan lain adalah mengabaikan kebutuhan dengan IgnorePlugin.

Berikut ini sebuah contoh:

var webpack = require("webpack");
module.exports = {
  // ...
  plugins: [
    new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /de|fr|hu/)
    // new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/)
  ]
};

Dalam proyek kami, saya sertakan momen seperti ini: import moment from 'moment/src/moment';dan itu sepertinya berhasil. Penggunaan momen kami sangat sederhana, jadi saya tidak yakin apakah akan ada inkonsistensi dengan SDK. Saya pikir ini berfungsi karena WebPack tidak tahu bagaimana menemukan file lokal secara statis, sehingga Anda mendapatkan peringatan (mudah disembunyikan dengan menambahkan folder kosong di moment/src/lib/locale/locale) tetapi tidak ada lokal yang menyertakan.

momentPustaka modular yang tepat akan muncul dengan Versi 3 di beberapa titik jadi saat ini karena saya menggunakan angular-cli tanpa --ejectsaya baru saja menggunakan https://github.com/ksloan/moment-mini sepertiimport * as moment from 'moment-mini';

Berdasarkan jawaban Adam McCrmick, Anda sudah dekat, ubah alias Anda menjadi:

resolve: {
    alias: {
        moment: 'moment/src/moment'
    },
},

Dengan webpack2dan versi terbaru dari momen yang dapat Anda lakukan:

import {fn as moment} from 'moment'

Dan kemudian dalam diri webpack.config.jsAnda lakukan:

resolve: {
    packageMains: ['jsnext:main', 'main']
}