Existe alguma maneira de você parar moment.js
de carregar todos os locais (só preciso de inglês) quando você estiver usando o webpack? Eu estou olhando a fonte e parece que, se hasModule
for definido, o que é para o webpack, ele sempre tenta require()
todos os códigos de idioma. Tenho certeza de que isso precisa de uma solicitação pull para corrigir. Mas existe alguma maneira de corrigir isso com a configuração do webpack?
Aqui está minha configuração do webpack para carregar momentjs:
resolve: {
alias: {
moment: path.join(__dirname, "src/lib/bower/moment/moment.js")
},
},
Então, em qualquer lugar que eu precisar, eu apenas preciso require('moment')
. Isso funciona, mas está adicionando cerca de 250 kB de arquivos de idioma desnecessários ao meu pacote. Também estou usando a versão bower do momentjs e gulp.
Além disso, se isso não puder ser corrigido pela configuração do webpack, há um link para a função em que ele carrega os códigos de idioma . Tentei adicionar && module.exports.loadLocales
à if
declaração, mas acho que o webpack não funciona de uma maneira que funcionaria. Apenas require
não importa o quê. Eu acho que ele usa um regex agora, então eu realmente não sei como você iria corrigi-lo.
fonte
nmp
vez debower
?Respostas:
O código
require('./locale/' + name)
pode usar todos os arquivos nolocale
diretório Portanto, o webpack inclui todos os arquivos como módulo em seu pacote. Ele não pode saber qual idioma você está usando.Existem dois plug-ins que são úteis para fornecer ao webpack mais informações sobre qual módulo deve ser incluído no seu pacote:
ContextReplacementPlugin
eIgnorePlugin
.require('./locale/' + name)
é chamado de contexto (um requisito que contém uma expressão). O webpack infere algumas informações deste fragmento de código: Um diretório e uma expressão regular. Aqui:directory = ".../moment/locale"
regular expression = /^.*$/
. Portanto, por padrão, todos os arquivos nolocale
diretório estão incluídos.O
ContextReplacementPlugin
permite substituir as informações inferidas, ou seja, fornecer uma nova expressão regular (para escolher os idiomas que você deseja incluir).Outra abordagem é ignorar o requisito com o
IgnorePlugin
.Aqui está um exemplo:
fonte
new webpack.IgnorePlugin(/^\.\/lang$/, /moment$/)
com o seu comentário no github funcionará.plugins: [ new webpack.IgnorePlugin(/^\.\/locale$/, [/moment$/]) ],
que funcionou muito bem.Em nosso projeto, incluo momentos como este:
import moment from 'moment/src/moment';
e isso parece funcionar. Nosso uso do momento é muito simples, portanto, não tenho certeza se haverá alguma inconsistência com o SDK. Eu acho que isso funciona porque o WebPack não sabe como encontrar os arquivos de localidade estaticamente, então você recebe um aviso (é fácil ocultar adicionando uma pasta vazia emmoment/src/lib/locale/locale
), mas nenhum local inclui.fonte
moment
biblioteca modular adequada apresentará a versão 3 github.com/moment/moment/milestone/15 em algum momento.A
moment
biblioteca modular adequada virá com a versão 3 em algum momento. Atualmente, como estou usando o angular-cli sem--eject
ter acabado de usar https://github.com/ksloan/moment-mini comoimport * as moment from 'moment-mini';
fonte
Com base na resposta de Adam McCrmick, você estava perto, altere seu alias para:
fonte
Com
webpack2
e versões recentes do momento, você pode fazer:E então
webpack.config.js
você faz:fonte
mainFields: ...