Moment: Adicionar suporte para empacotadores compatíveis com ESM
Olá!
Obrigado por esta ótima biblioteca!
No entanto, acredito que o campo "module" no manifesto do pacote ( package.json file) deve apontar para o pacote ESM, por exemplo, ./src/moment.js .
Bundlers que suportam ESM (Webpack, Rollup e outros) devem ser capazes de encontrar o pacote ESM usando o campo module para usar técnicas de otimização modernas (como agitação de árvore). No momento, o pacote ./moment.js UMD é usado em seu lugar.
Isso faz com que a biblioteca inteira seja carregada em projetos habilitados para ESM, mesmo se você importar um único símbolo dela.
Por exemplo, uma importação como esta:
import { isMoment } from 'moment';
importará tudo da biblioteca, no entanto, apenas uma função foi solicitada.
E você não pode usar import { isMoment } from 'moment/src/moment'; como uma solução alternativa em projetos TypeScript porque isso quebrará as digitações.
slavafomin
Todos 3 comentários
Depois de examinar o conteúdo de ./src/moment.js , estou retirando minhas palavras. O conteúdo não faz sentido do ponto de vista do ESM. Em vez de importar e reexportar símbolos úteis como Moment , isMoment , etc, ele está construindo um objeto e o exporta. Eu acredito que é um ponto de entrada para o pacote UMD, não é?
Para que as ferramentas modernas funcionem, precisamos de um pacote ESM adequado, que exportará todos os símbolos úteis individualmente.
Consegui importar os símbolos de que preciso (sem carregar o pacote inteiro de moment.js) desta forma:
// @ts-ignore
import { isMoment, Moment } from 'moment/src/lib/moment/constructor';
Mas tive que suprimir os erros de digitação com @ts-ignore , que permite a importação, mas quebra todas as digitações dos símbolos importados. Além disso, o caminho é feio e não deve ser usado pelos usuários finais (porque quebra o encapsulamento).
Acabei de fazer um experimento. Criei um arquivo chamado moment.esm.js na raiz do pacote com o seguinte conteúdo:
export { isMoment, Moment } from './src/lib/moment/constructor';
E adicionou um campo module para apontar para ele a partir do manifesto do pacote.
Então eu importei em meu aplicativo:
import { isMoment, Moment } from 'moment';
Ele importou corretamente com as declarações de digitação funcionando conforme o esperado e também funcionou corretamente durante as compilações de Webpack e Rollup. Apenas os símbolos especificados foram importados sem carregar um pacote completo com todos os locais.
Acredito que este é um caminho a percorrer e pode ser estendido para exportar outros símbolos, descritos nas declarações.
slavafomin
em 12 nov. 2019
Eu apoio isso.
arswaw
em 11 dez. 2019
Consulte https://momentjs.com/docs/#/ -project-status /
marwahaha
em 15 set. 2020
Questões relacionadas
RobinvanderVliet
·
3Comentários
alvarotrigo
·
3Comentários
dogukankotan
·
3Comentários
dbshwang
·
3Comentários
IbraheemAlSaady
·
3Comentários
Comentários muito úteis
Depois de examinar o conteúdo de
./src/moment.js, estou retirando minhas palavras. O conteúdo não faz sentido do ponto de vista do ESM. Em vez de importar e reexportar símbolos úteis comoMoment,isMoment, etc, ele está construindo um objeto e o exporta. Eu acredito que é um ponto de entrada para o pacote UMD, não é?Para que as ferramentas modernas funcionem, precisamos de um pacote ESM adequado, que exportará todos os símbolos úteis individualmente.
Consegui importar os símbolos de que preciso (sem carregar o pacote inteiro de moment.js) desta forma:
Mas tive que suprimir os erros de digitação com
@ts-ignore, que permite a importação, mas quebra todas as digitações dos símbolos importados. Além disso, o caminho é feio e não deve ser usado pelos usuários finais (porque quebra o encapsulamento).Acabei de fazer um experimento. Criei um arquivo chamado
moment.esm.jsna raiz do pacote com o seguinte conteúdo:E adicionou um campo
modulepara apontar para ele a partir do manifesto do pacote.Então eu importei em meu aplicativo:
Ele importou corretamente com as declarações de digitação funcionando conforme o esperado e também funcionou corretamente durante as compilações de Webpack e Rollup. Apenas os símbolos especificados foram importados sem carregar um pacote completo com todos os locais.
Acredito que este é um caminho a percorrer e pode ser estendido para exportar outros símbolos, descritos nas declarações.