Як не допустити, щоб moment.js не завантажував локалі за допомогою веб-пакета?

Чи є якийсь спосіб, коли ви не можете moment.jsзавантажувати всі локалі (мені просто потрібна англійська мова), коли ви використовуєте веб-пакет? Я дивлюся на джерело, і здається, що якщо hasModuleвизначено, що це для webpack, то воно завжди намагається перейти до require()кожної локалі. Я впевнений, що для виправлення потрібен запит на витяг. Але чи можна це виправити за допомогою конфігурації webpack?

Ось моя конфігурація веб-пакета для завантаження momentjs:

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

Тоді, де мені це потрібно, я просто роблю require('moment'). Це працює, але додає близько 250 кБ непотрібних мовних файлів у мій пакет. Також я використовую бауер-версію momentjs та gulp.

Також якщо конфігурація веб-пакету цього неможливо виправити, тут є посилання на функцію, де вона завантажує локалі . Я спробував додати && module.exports.loadLocalesдо ifзаяви, але, мабуть, webpack насправді не працює таким чином, де це буде працювати. Це просто requireнезважаючи ні на що. Я думаю, що зараз він використовує регулярний вираз, тому я не знаю, як би ви навіть вирішили його виправити.

Код require('./locale/' + name)може використовувати кожен файл у режимі locale. Тож вебпакет включає кожен файл як модуль у вашому пакеті. Він не може знати, якою мовою ви користуєтесь.

Є два плагіни , які корисні для того, щоб дати веб-упаковці більше інформації про те, який модуль повинен бути включений у ваш пакет: ContextReplacementPluginта IgnorePlugin.

require('./locale/' + name)називається контекстом (потреба, яка містить вираз). webpack виводить деяку інформацію з цього фрагмента коду: Каталог та регулярний вираз. Тут: directory = ".../moment/locale" regular expression = /^.*$/. Отже, за замовчуванням кожен файл у localeкаталозі включений.

ContextReplacementPluginДозволяє перевизначити виведену інформацію тобто забезпечити нове регулярне вираз (вибрати мови , які ви хочете включити).

Іншим підходом є ігнорування вимоги з IgnorePlugin.

Ось приклад:

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

У нашому проекті я включаю такий момент: import moment from 'moment/src/moment';і це, здається, робить свою справу. Наше використання моменту дуже просто, тому я не впевнений, чи будуть невідповідності з SDK. Я думаю, що це працює, тому що WebPack не знає, як статично знайти файли локалів, тому ви отримуєте попередження (це легко приховати, додавши порожню папку в moment/src/lib/locale/locale), але жодна локаль не включає.

Власна модульна momentбібліотека придумає версію 3 в якийсь момент, тому в даний час, як я використовую angular-cli, --ejectя не закінчила використання https://github.com/ksloan/moment-mini, якimport * as moment from 'moment-mini';

Виходячи з відповіді Адама МакКрміка, ви були поруч, змінивши псевдонім на:

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

З webpack2моментом та останніми версіями моменту ви можете:

import {fn as moment} from 'moment'

А потім у webpack.config.jsвас:

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