Rrule: Como carregar o Rrule?

Criado em 3 jun. 2019  ·  11Comentários  ·  Fonte: jakubroztocil/rrule

Esta é uma pergunta realmente básica, mas eu não vi ninguém fazendo isso nas edições fechadas, então vou tentar - como você adiciona rrule.js ao navegador? Eu tentei adicioná-lo no codepen, mas simplesmente não consigo fazê-lo funcionar, apesar de tentar muitas maneiras diferentes de exigir / importar módulos.

Ou seja, continuo vendo este erro no console
image

Eu até tentei carregá-lo em observável, mas também não conseguia fazer isso funcionar. Qualquer ajuda é bem vinda, obrigado :)

Comentários muito úteis

Hmm, então eu nunca tive motivos para importar um módulo ES6 diretamente para o navegador (embora este possa ser um módulo UMD), mas parece que o código a seguir funciona no codepen:

// This imports everything in the `rrule` namespace
import "https://jakubroztocil.github.io/rrule/dist/es5/rrule.min.js"

console.log(rrule)

// Create a rule:
const rule = new rrule.RRule({
  freq: rrule.RRule.WEEKLY,
  interval: 5,
  byweekday: [rrule.RRule.MO, rrule.RRule.FR],
  dtstart: new Date(Date.UTC(2012, 1, 1, 10, 30)),
  until: new Date(Date.UTC(2012, 12, 31))
})

// Get all occurrence dates (Date instances):
console.log(rule.all())

Todos 11 comentários

Existem muitas maneiras de usar o rrule no navegador. Se você quiser apenas brincar com a regra de teste / no seu navegador, você pode usar algo como stackblitz, que permite importar o módulo do npm.

Você está tendo problemas porque está tentando importar um caminho de arquivo relativo ("rrule") dos servidores do codepen (e, embora eu nunca tenha usado o codepen, duvido que o codepen tenha disponibilizado rrule para são usuários de alguma forma). Você precisaria importar o javascript de um CDN se não for servi-lo sozinho.

Ei @thefliik , muito obrigado pelo seu comentário :)

stackblitz parece incrível. Codepen é muito parecido com o stackblitz no sentido de que é um playground para a construção de páginas da web e permite que você carregue scripts de diferentes CDNs. Eu carreguei meu script por meio do settings dialog> Javascript > do codepen e, em seguida, digitei o caminho do arquivo para o meu script hospedado.

image

Atualmente estou hospedando a regra em https://s3.amazonaws.com/appforest_uf/f1559527195623x315562171275647800/rrule.min.js .

Aqui está a caneta atualizada, onde estou explicitamente carregando a regra por meio de um

importe {RRule, RRuleSet, rrulestr} de " https://s3.amazonaws.com/appforest_uf/f1559527195623x315562171275647800/rrule.min.js/ "

Esse código, que vejo que você tentou, é a sintaxe ES6 correta (embora pareça que faltou uma vírgula no seu código). Parece que o S3 está bloqueando a tentativa de acesso (se você olhar para o console, ele está respondendo com um código de status 403 proibido).

Aqui está um projeto simples que importou a regra: https://stackblitz.com/edit/js-bbaffe

Tão estranho, S3 está definitivamente carregando o recurso em meu console
image

Pelo que eu entendi, não há outras dependências que eu preciso carregar, certo (eu tentei adicionar o texto digitado, mas isso não pareceu importar)?

Se eu tivesse um ambiente npm, copiaria aquele adorável projeto stackblitz que você forneceu, mas infelizmente estou limitado apenas ao código do lado do cliente: /

De acordo com o Google , a extensão do arquivo pode ser importante nos módulos.

Uma nota sobre extensões de arquivo
Você deve ter notado que estamos usando a extensão de arquivo .mjs para módulos. Na Web, a extensão do arquivo realmente não importa, contanto que o arquivo seja servido com o tipo MIME JavaScript text/javascript . O navegador sabe que é um módulo por causa do atributo type no elemento de script.

Parece que meus arquivos não são servidos como text/javascript mas sim como application/javascript ou application/x-javascript . Será esse o problema? Alguém aqui tem uma versão hospedada do rrule que o entrega com o tipo MIME text/javascript ?

Hmm, então eu nunca tive motivos para importar um módulo ES6 diretamente para o navegador (embora este possa ser um módulo UMD), mas parece que o código a seguir funciona no codepen:

// This imports everything in the `rrule` namespace
import "https://jakubroztocil.github.io/rrule/dist/es5/rrule.min.js"

console.log(rrule)

// Create a rule:
const rule = new rrule.RRule({
  freq: rrule.RRule.WEEKLY,
  interval: 5,
  byweekday: [rrule.RRule.MO, rrule.RRule.FR],
  dtstart: new Date(Date.UTC(2012, 1, 1, 10, 30)),
  until: new Date(Date.UTC(2012, 12, 31))
})

// Get all occurrence dates (Date instances):
console.log(rule.all())

Tão estranho, S3 está definitivamente carregando o recurso em meu console

Talvez você esteja logado em sua conta amazon em seu computador

Isso é o que eu estava pensando, mas não, posso acessar esse arquivo no modo anônimo e em um segundo computador que não tem acesso. Como visto aqui , até tentei carregar o script do jsdeliver sem sorte.

@zeluspudding você não viu meu comentário anterior?

import "https://jakubroztocil.github.io/rrule/dist/es5/rrule.min.js" funciona para mim no codepen.

Oh, sinto muito - perdi seu comentário. E sim! Funciona :)

Muito obrigado! Eu realmente aprecio toda a ajuda.

Eu sugiro talvez uma atualização para o guia de primeiros passos com seu trecho de código (para este caso de importação de um módulo ES6 diretamente para o navegador). Posso enviar uma solicitação de pull, se você quiser

Para qualquer pessoa interessada em jogar com o rrule no observável visite este link .

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

agordeev picture agordeev  ·  16Comentários

jimmywarting picture jimmywarting  ·  9Comentários

espen picture espen  ·  11Comentários

maconfr picture maconfr  ·  6Comentários

kirrg001 picture kirrg001  ·  5Comentários