Rrule: Wie lade ich eine Regel?

Erstellt am 3. Juni 2019  ·  11Kommentare  ·  Quelle: jakubroztocil/rrule

Dies ist eine wirklich grundlegende Frage, aber ich habe in den geschlossenen Ausgaben niemanden gesehen, die sie gestellt hat, also werde ich es versuchen - wie fügt man rrule.js zum Browser hinzu? Ich habe versucht, es in Codepen hinzuzufügen, aber ich kann es einfach nicht zum obwohl ich viele verschiedene Möglichkeiten zum Anfordern / Importieren von Modulen ausprobiert habe.

Ich sehe diesen Fehler nämlich immer wieder in der Konsole
image

Ich habe sogar versucht, es in Observable zu laden, aber es scheint auch nicht zu funktionieren. Jede Hilfe ist willkommen, danke :)

Hilfreichster Kommentar

Hmm, ich hatte also noch nie Anlass, selbst ein ES6-Modul direkt in den Browser zu importieren (obwohl dies ein UMD-Modul sein könnte), aber es sieht so aus, als ob der folgende Code auf Codepen funktioniert:

// 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())

Alle 11 Kommentare

Es gibt viele Möglichkeiten, rrule im Browser zu verwenden. Wenn Sie nur in Ihrem Browser herumspielen / rrule testen möchten, können Sie so etwas wie stackblitz verwenden, mit dem Sie das Modul von npm importieren können.

Sie haben Probleme, weil Sie versuchen, einen relativen Dateipfad ("rrule") von den Servern von Codepen zu importieren (und obwohl ich Codepen noch nie verwendet habe, bezweifle ich, dass Codepen rrule verfügbar gemacht hat es ist in irgendeiner Weise Benutzer). Sie müssen das Javascript von einem CDN importieren, wenn Sie es nicht selbst bereitstellen möchten.

Hey @thefliik , vielen Dank für deinen Kommentar :)

Stackblitz sieht unglaublich aus. Codepen ist Stackblitz insofern sehr ähnlich, als es eine Spielwiese zum Erstellen von Webseiten ist und Sie Skripte von verschiedenen CDNs laden können. Ich hatte mein Skript über den settings Dialog von Codepen > Javascript > geladen und dann den Dateipfad zu meinem gehosteten Skript eingegeben.

image

Ich hoste derzeit rrule bei https://s3.amazonaws.com/appforest_uf/f1559527195623x315562171275647800/rrule.min.js .

Hier ist der aktualisierte Stift, in den ich rrrule explizit über a

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

Dieser Code, den Sie meiner Meinung nach versucht haben, ist die korrekte ES6-Syntax (obwohl es so aussieht, als hätte in Ihrem Code ein Komma gefehlt). Sieht so aus, als würde S3 den Zugriffsversuch blockieren (wenn Sie sich die Konsole ansehen, antwortet sie mit einem verbotenen Statuscode 403).

Hier ist ein einfaches Projekt, das rrule importiert hat: https://stackblitz.com/edit/js-bbaffe

Seltsam, S3 lädt definitiv die Ressource in meiner Konsole
image

Soweit ich weiß, gibt es keine anderen Abhängigkeiten, die ich laden muss, oder (ich habe versucht, Typoskript hinzuzufügen, aber das schien keine Rolle zu spielen)?

Hätte ich eine npm-Umgebung, würde ich das schöne Stackblitz-Projekt kopieren, das Sie bereitgestellt haben, aber leider bin ich nur auf den clientseitigen Code beschränkt :/

Laut Google kann die Dateierweiterung bei Modulen eine Rolle spielen.

Ein Hinweis zu Dateierweiterungen
Sie haben vielleicht bemerkt, dass wir die Dateierweiterung .mjs für Module verwenden. Im Web spielt die Dateierweiterung keine Rolle, solange die Datei mit dem JavaScript-MIME-Typ text/javascript . Der Browser erkennt aufgrund des type-Attributs des script-Elements, dass es sich um ein Modul handelt.

Anscheinend werden meine Dateien nicht als text/javascript bereitgestellt, sondern als application/javascript oder application/x-javascript . Könnte das das Problem sein? Hat hier jemand eine gehostete Version von rrule, die es mit dem MIME-Typ text/javascript ausliefert?

Hmm, ich hatte also noch nie Anlass, selbst ein ES6-Modul direkt in den Browser zu importieren (obwohl dies ein UMD-Modul sein könnte), aber es sieht so aus, als ob der folgende Code auf Codepen funktioniert:

// 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())

Seltsam, S3 lädt definitiv die Ressource in meiner Konsole

Vielleicht sind Sie auf Ihrem Computer bei Ihrem Amazon-Konto angemeldet

Das habe ich mir gedacht, aber nein, ich kann auf diese Datei aus dem Inkognito-Modus und einem zweiten Computer zugreifen, der keinen Zugriff hat. Wie hier zu sehen ist, habe ich sogar versucht, das Skript ohne Glück von jsdeliver zu

@zeluspudding hast du meinen vorherigen Kommentar nicht gesehen?

import "https://jakubroztocil.github.io/rrule/dist/es5/rrule.min.js" funktioniert bei mir auf Codepen.

Oh, tut mir leid - ich habe deinen Kommentar übersehen. Und ja! Es funktioniert :)

Vielen Dank! Ich bin wirklich dankbar für jede Hilfe.

Ich würde vielleicht ein Update des Handbuchs "Erste Schritte" mit Ihrem Code-Snippet vorschlagen (für diesen Fall des direkten Imports eines ES6-Moduls in den Browser). Ich kann eine Pull-Anfrage senden, wenn Sie möchten

Für jeden , der daran interessiert ist , mit rrule in Observable zu spielen , besuchen Sie diesen Link .

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen