2013-06-05 4 views
14

Mit Sass (SCSS)/Compass, ist es möglich, CSS/SCSS aus einer extern gehosteten Datei in Ihren Code zu importieren?Kann ich eine extern gehostete Datei mit Sass importieren?

Ich hostet ein jQuery-Plugin auf einem CDN und möchte das CSS am selben Ort behalten, damit ich es nicht verliere. Allerdings hätte ich auch gerne die Möglichkeit, das CSS in meinen Code zu ziehen und es in meinem Haupt-CSS kompilieren zu lassen, anstatt eine zusätzliche CSS-Datei in meinen HTML-Code einzufügen. Ist das möglich?

Antwort

9

Sass kompiliert keine Dateien von einem Remotestandort, alle Dateien müssen vom Dateisystem aus zugänglich sein (lokale Festplatte, freigegebenes Netzlaufwerk, eingehängtes Laufwerk usw.).

Sass kompiliert auch überhaupt keine CSS-Dateien. https://github.com/nex3/sass/issues/556

@import "my.css"; 

Compiliert zu

@import "my.css"; 

Vielleicht könnten Sie in Compass extensions interessiert?

+1

Ihre Antwort ist nicht wirklich auf die Frage bezogen. Er fragte, ob er extern gehostete CSS-Dateien innerhalb von Sass verwenden könne, nichts über lokale CSS-Dateien. Ich bin mir ziemlich sicher, dass Sass CSS-Dateien sowieso nicht in seine Ausgabedatei kompiliert. – Vince

+5

@Ghodmode Vielleicht solltest du die Frage noch einmal lesen: "Ich hätte auch gerne die Möglichkeit, das CSS in meinen Code zu ziehen und es in meinem Haupt-CSS kompilieren zu lassen". Ich weiß nicht, wie sonst das gedeutet werden könnte. Der Speicherort der Datei ist irrelevant, da Sie die gleichen Ergebnisse erhalten. Derzeit macht Sass nicht das, was gefragt wird. – cimmanon

+1

@cimmanon Dein Kommentar ist nicht ganz korrekt. Sass wird eine .scss-Datei direkt in die Zieldatei importieren, d. H. Es wird so kompiliert, als ob Sie den importierten Inhalt direkt in diese Datei geschrieben hätten. Jedoch importieren importierte .css-Dateien, URL() s oder jeder Import, der mit http: // beginnt, als '@ import'. Dies bedeutet, dass Sie immer noch die zusätzliche HTTP-Anforderung haben, die Sie möglicherweise beseitigen möchten. Die Lage ist wichtig. –

8

Sie können sicher. In diesem Zusammenhang funktioniert es genau wie die Standardregel CSS . Gib ihm einfach eine URL zu der CDN-gehosteten CSS-Datei.

http://sass-lang.com/documentation/file.SASS_REFERENCE.html#import

+1

Fehle ich etwas oder sagt dein Link explizit, dass es * nicht * möglich ist? –

+0

Sass erweitert die CSS @ import-Regel, um SCSS- und Sass-Dateien importieren zu können. Alle importierten SCSS- und Sass-Dateien werden in einer einzigen CSS-Ausgabedatei zusammengeführt. Darüber hinaus können alle Variablen oder Mixins, die in importierten Dateien definiert sind, in der Hauptdatei verwendet werden. – Vince

+1

"wobei" @import "http://foo.com/bar"; 'zu" @import "http://foo.com/bar"; "" kompilieren würde. Wenn Sie eine extern gehostete Sass/SCSs-Datei importieren, wird der Import in das Endergebnis wie bei einem CSS-Import kompiliert. –

2

Ja, können Sie externe CSS-Datei mit PostCSS Import URL Plugin importieren. Es wird das externe CSS in Ihren Code ziehen, sodass Sie es in Ihrem Haupt-CSS kompilieren können.

0

Für diejenigen von euch, die hierher kamen nach einer Möglichkeit, ein CDN als sass der Import @import ich die Antwort hier: https://github.com/webpack-contrib/sass-loader/issues/246

Dies ist, wie Sie es tun (als Beispiel Bootstrap):

styles.scss

@import url("https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css");