Less.js: doppelte Eigenschaften beim mehrfachen @importieren (verschachtelter @import)

Erstellt am 25. Juni 2010  ·  49Kommentare  ·  Quelle: less/less.js

Master @importe A & B,
B @importe A

Bei Verwendung eines Mixins von A in der Masterdatei werden die Eigenschaften dupliziert

Weitere Informationen finden Sie im Unit-Test

Config: Lessc cli-Version 1.0.21 auf Ubuntu 10.04

Alle 49 Kommentare

Ich denke, das Problem ist, dass die Datei zweimal importiert wird, das ist das richtige Verhalten für Mixins.

Meinst du, es sollte die Datei zweimal importieren? Wenn nicht, sollten auch relative URLs berücksichtigt werden. Zum Beispiel

// in main.less
<strong i="6">@import</strong>: imports/import1.less;
<strong i="7">@import</strong>: imports/import2.less;

// in imports/import1.less
<strong i="8">@import</strong>: import2.less; // don't import this
<strong i="9">@import</strong>: imports/import2.less; // do import this

hmmm, ich frage mich, ob es eine einfachere Möglichkeit gibt, zu überprüfen, ob eine Datei einer anderen gleicht. Vielleicht etwas in den Überschriften.

Die Dateigröße ist ein billiger Indikator und ist höchstwahrscheinlich in jedem bestimmten Satz von Quelldateien einzigartig. Es ist jedoch _möglich_, 2 Dateien mit der gleichen Größe zu haben.

Ebenso mit Datum geändert.

Wenn der Server den ETag-Header setzt, können / sollten Sie diesen verwenden.

Wir verwenden den MD5-Hash des Dateiinhalts als Schlüssel beim Caching, aber ich persönlich halte das für übertrieben.

hmmm, ja, das Problem ist, dass Javascript kein natives MD5 hat, oder ich würde das verwenden.
ETag wäre ideal, aber einige Server setzen es nicht. Darüber muss ich nachdenken.

Es scheint, dass wir uns einig sind, dass die Dateien nicht zweimal importiert werden sollten. Aber stimmt das immer? (dh mit Hilfe von Scope kann das Importieren in ein Mixim ok sein - Cloudhead können Sie hier besser beantworten als ich).

Viele Sprachen haben dieses Problem bereits auf unterschiedliche Weise gelöst:

  • C -> #ifndef / #define / #endif
  • PHP -> include_once()

Der "C-Weg" ist möglicherweise etwas schwieriger zu implementieren, aber Bedingungen bieten möglicherweise andere großartige Möglichkeiten.

Wenn der "PHP-Weg" gewählt wird, müssen wir einen Weg wählen, um Dateien zu unterscheiden. Die absolute URL scheint eine gute Wahl zu sein (wir haben sie entweder direkt oder über document.location + relative URL) - ich denke, sie ist besser als Größe / Länge / MD5, da sie keine HTTP-Anfrage verbraucht.
Dies reicht jedoch möglicherweise nicht aus: Jede URL wird einer einzelnen Datei zugeordnet, aber jede Datei kann mehreren URLs zugeordnet sein. In diesem Fall kann die Einführung eines neuen Schlüsselworts @<strong i="16">@name</strong>: <unique name> helfen.

Der @import_once-Algorithmus wäre dann: wenn die absolute URL noch nicht importiert wurde, holen Sie sich die Dateien und überprüfen Sie, ob der @ @name bereits importiert wurde, wenn nicht, importieren Sie die Datei.

Ich stimme zu. im Kontext einer einzelnen Anfrage sollten Sie davon ausgehen können, dass sich die Ressourcen nicht ändern. Also sollten die absoluten URLs gut genug sein.

die Überprüfung auf Dateiänderungen ist eine andere Sache.

Ich denke, wir sollten @import import mehrmals beibehalten , da der ursprüngliche

i wie @vicb ‚s php-ähnliche Lösung, aber statt @import_once i wie etwas besser in‚Kommentar‘ , so dass es immer noch kompatibel mit Original - CSS - Syntax.

können wir oben in der .less-Datei so etwas hinzufügen:
/_! erfordern: URL (./abc.less)_/

Ich habe dieses Problem auch. Mein Projekt hat eine Hierarchie von WENIGER Dateien, die in eine einzelne CSS-Datei kompiliert werden. Es gibt eine Dienstprogramm-LESS-Datei, die in mehreren Dateien enthalten ist, im Endergebnis werden alle Mixins so oft dupliziert, wie diese Dienstprogrammdatei importiert wurde.

Ein @import_once , oder vielleicht @import : once url('url'); würde dieses Problem lösen.

Wir stehen bei unserem Projekt vor dem gleichen Problem wie @NielsJanssen. Haben Sie eine Idee, bis wann dieses Problem behoben wird??

Läuft auch auf dieses Problem. Findet jemand eine Lösung?

Habe hier das gleiche Problem. Konnte keine einfache Lösung finden, habe nur die Importe neu angeordnet, damit sie nicht zweimal importiert werden.

Ich würde wirklich vorschlagen, Stylus auszuprobieren, wenn Sie node.js verwenden. Ich habe eine Weile LESS benutzt, war frustriert über die völlige Entwicklungslosigkeit, wechselte zu SASS und dann schließlich zu Stylus. Es nagelt die Funktionen wirklich auf den Punkt, die Syntax ist optional (und ich verwende einen Mittelweg), es ist sehr mächtig und TJ ist ein wirklich reaktionsschneller Entwickler davon.

Wenn Sie node.js nicht verwenden, können Sie Stylus trotzdem mit Ruby und Kompilieren auf Ihrem Computer verwenden. Und wenn Sie Stylus aus irgendeinem Grund nicht mögen, ist SASS/SCSS auch eine schöne Alternative und kann genauso gemacht werden.

Lange Rede, kurzer Sinn: WENIGER ist auf Dauer nicht gut.

Sehr schlechter Einstellungsmann.

Es ist nicht notwendig, diese bs hier zu posten. Sie hätten es per Post oder ähnlichem senden können. Sie können keine so hohen Standards haben, wie zum Beispiel einen "wirklich reaktionsschnellen Entwickler" für etwas, das kostenlos verwendet werden kann.

Absolut nicht.

Ich hätte diesen Rat geliebt, als ich zum ersten Mal LESS gefunden habe, damit ich nicht wochenlang Zeit damit verschwendete, mich daran zu gewöhnen und darauf umzusteigen und davon zu profitieren, als ich schließlich ging. Zugegeben, ich hätte es zuerst selbst bemerken müssen, da es mehr offene als geschlossene Probleme gibt und auf die meisten nicht reagiert wurde.

Es geht nicht darum, welche Standards ich haben kann oder nicht. Es geht darum, die Menschen zu warnen, wenn es bessere Alternativen gibt.

Also stehe ich zu meiner "BS" und hoffe, dass die Leute die Warnung hilfreich finden.

@ianstormtaylor : Zu sagen, ein Projekt sei "auf lange Sicht nicht gut" ist ein bisschen hysterisch.

habe das gleiche Problem auch.

foo.weniger

<strong i="7">@import</strong> "bar.less";
<strong i="8">@import</strong> "baz.less";

bar.weniger

<strong i="12">@import</strong> "mixins.less";
.bar {
  .mixer
}

baz.less

<strong i="16">@import</strong> "mixins.less";
.baz {
  .mixer
}

mixins.weniger

.mixer {
  color: 000;
  border: 2px solid #fff;
}
$ lessc foo.less
.mixer {
  color: 000;
  border: 2px solid #fff;
}
.bar {
  color: 000;
  border: 2px solid #fff;
  color: 000;
  border: 2px solid #fff;
}
.mixer {
  color: 000;
  border: 2px solid #fff;
}
.baz {
  color: 000;
  border: 2px solid #fff;
  color: 000;
  border: 2px solid #fff;
}

Ich habe mich früher aus dieser Diskussion herausgehalten, aber jetzt, wo ich mit dem gleichen Problem konfrontiert bin ... @ianstormtaylor hysterisch ist. Überprüfen Sie einfach die Liste der offenen Probleme für dieses Projekt und wie lange einige von ihnen geöffnet sind. Weniger ist ein nützliches Werkzeug, aber ich denke, es ist eine faire Einschätzung, dass die Unterstützung begrenzt ist und das beim Warten sehr frustrierend sein kann.

Ich habe den Eindruck, dass @cloudhead meistens alle Kommentare ignoriert, die ich mache (vielleicht

Sie _könnten_ nur eine main.less Datei haben, die alle Ihre Importe enthält. Ein Beispiel finden Sie im Twitter-Bootstrap (die Hauptdatei ist bootstrap.less ).

Einige der weniger Dateien, die ich importiere (aus einer externen Bibliothek), sind so geschrieben, dass sie eigenständig kompiliert werden können, sodass sie jeweils ein gemeinsames variables.less und das Problem, das ich sehe, tritt auf, weil ich jede dieser Dateien importiere weniger Dateien in eine Hauptdatei und dann das Kompilieren dieser Datei wendet jedes Mixin so oft an, wie die Mixins eingebunden werden (einmal für jede Datei, die ich aus der externen Bibliothek einbeziehe).

Sie haben Recht - ich _könnte_ etwas tun, wie Sie es vorgeschlagen haben, und ich _bin_ so etwas in dem Code, über den ich die vollständige Kontrolle habe, aber das bedeutet nicht, dass jeder es so macht.

Auch eine Problemumgehung (_nur_ wenn ich keine Bibliothek von Drittanbietern verwendet habe) ändert nichts daran, dass dies ein Fehler ist. Ich bin ziemlich vertraut damit, Probleme mit weniger zu umgehen, aber es ist frustrierend, dass Fehler wie dieser seit fast 18 Monaten offen sind. ( @wlangstroth, ich

Für alle, die daran interessiert sind, habe ich einen Brute-Force-Fix (nicht gegen den Test von @vicb getestet, sollte aber funktionieren), den ich in einen Kommentar zu #431 eingefügt habe. Ich werde versuchen, eine bessere Lösung zu finden, wenn ich etwas mehr Zeit habe.

habe das selbe problem

Hatte auch dieses Problem, aber es wurde behoben, indem meine Mixin-Bibliotheken in meine bootstrap.less importiert wurden. Wusste nicht, dass nachfolgende Importe Zugriff darauf haben, aber es macht Sinn.

fyi #431 ist ein Pull-Request, der dieses Problem behebt

@cloudhead Könnten Sie dafür einen Fix anwenden. Dies ist wahrscheinlich eines der ältesten noch offenen Probleme. Wäre schön wenn es gelöst wird.

Das gleiche Problem :-(

Als Vorschlag für alle, die Probleme mit diesem Problem haben, würde ich empfehlen, Alexis eine Nachricht auf Twitter zu senden. Alexis hat zuvor in mehreren Tickets gesagt, dass er nicht alle Probleme überwachen kann und wirklich nur behebt, wenn er auf die Schwere aufmerksam gemacht wird. Ich halte dies für ein schwerwiegendes Problem, konnte Alexis jedoch nicht auf Twitter darauf aufmerksam machen.

Vielleicht hat jemand anderes mehr Glück.

Twitter: https://twitter.com/#!/cloudhead

Und fügen Sie einen Link zu dieser Ausgabe hinzu: https://github.com/cloudhead/less.js/issues/49

@Kalyse Wenn @cloudhead die Probleme dieses Projekts nicht angemessen überwachen kann, ist dies für alle ein Grund mehr, es nicht zu verwenden. Leute haben vorgeschlagen, dass er einige andere Leute ernennen sollte, um bei der Bewältigung des Rückstands an Problemen zu helfen, aber auch hier gab es keine Antwort.

warum sollte ich twitter verwenden, um die aufmerksamkeit von jemandem zu erregen, wenn er bereits Benachrichtigungen erhalten kann, wenn ich ihn in einem problem erwähne? Ich finde es beschämend, dass @cloudhead es nicht schafft, auf Probleme zu reagieren, die seit 2 Jahren offen sind - er könnte zumindest ein paar Leute finden, denen er vertraut, und sie dazu bringen, den Rückstand offener Probleme abzuarbeiten. sie könnten zumindest Duplikate schließen und dazu beitragen, die Anzahl offener Probleme für ihn zu reduzieren.

Das github-Benachrichtigungssystem ist völlig nutzlos - ich bekomme ungefähr 70-100 Benachrichtigungen pro Tag, also ignoriere ich sie lieber einfach.

ich werde mir das mal anschauen..

Ok, ich habe eine @import-once -Direktive hinzugefügt - sie ist ziemlich rudimentär, da sie nur überprüft, ob die Pfade übereinstimmen - aber sie sollte die meisten Anwendungsfälle abdecken.

@cloudhead Schön, dass Sie dieses Problem

Ich persönlich verstehe nicht, warum dieses Projekt überhaupt auf Github ist, wenn Pull-Requests nicht einmal berücksichtigt werden oder warum der Issue-Tracker sogar läuft, wenn Issues ignoriert werden.

Einfach Leute! Wenn eine Person ein so beliebtes Projekt hätte, säße sie im selben Boot. @cloudhead hat großartige Arbeit geleistet und muss möglicherweise ein paar vertrauenswürdige Personen als

Die Leute haben viele Probleme gelöst, manchmal schon vor Jahren. Sehen Sie sich einen der 74 ausstehenden Pull-Requests ohne Antwort an. Zum Beispiel gibt es bei diesem Problem viele Duplikate, die 2 Jahre zurückreichen (wie # 324 # 71). Hier ist eine Pull-Anfrage, die dieses Problem ziemlich einfach behoben hätte: https://github.com/cloudhead/less.js/pull/431Der Commiter bat um Feedback, wurde mit Schweigen beantwortet und gab dann schließlich auf.

@cloudhead - Alexis, das ist einfach ein zu großartiges Projekt, um es verfallen zu lassen. Wenn Leute die oben genannten Dinge sehen, hinterlässt dies den Eindruck, dass das Projekt nicht vertrauenswürdig oder unzuverlässig ist. Und es ist unnötig! Die Magie von github besteht darin, dass Sie leicht einige Leute finden können, die großartigen Code schreiben und daran interessiert sind, sich für das Projekt zu engagieren. Fragen Sie diese guten Leute, ob sie bei der Moderation von Problemen und Pull-Requests helfen.

Wir alle lieben deine Arbeit. Die Gemeinde will helfen. Lasst uns helfen!

@jeremyricketts guter Punkt.

Ich stimme @jeremyricketts zu - bei einem Unternehmen, für das ich arbeite, haben wir uns aufgrund des Fehlens von Updates/Bugfixes in diesem

@cloudhead es sieht so aus, als ob die @import-once Direktive nicht funktioniert, dies ist mein Testfall.

// a.less
.gain-bfc() {
  overflow: hidden;
  *zoom: 1;
}

// b.less
@import-once "a.less";

// c.less
@import-once "a.less";
@import-once "b.less";

div {
  .gain-bfc();
}

nach dem Kompilieren von c.less sollte das erwartete Ergebnis lauten

div {
  overflow: hidden;
  *zoom: 1;
}

aber ich habe die duplizierten Eigenschaften

div {
  overflow: hidden;
  *zoom: 1;
  overflow: hidden;
  *zoom: 1;
}

+1 Jeremyricketts

Es wird jemand mit einigen tatsächlichen Programmierkenntnissen benötigt. Meine Welt besteht aus PSDs, Bleistift und Papier sowie HTML-CSS und leichter jQuery-Arbeit.

Es werden nur ein paar Leute benötigt, um die Probleme zu prüfen und Anfragen zu ziehen.
bereinigen Sie Duplikate, stellen Sie sicher, dass es Testfälle für Fehler gibt usw. Ich möchte
mich freiwillig zu melden, um zumindest dabei zu helfen, und ich kann wahrscheinlich helfen
schließen Sie auch die kleineren Fehler.
Am 23.03.2012 um 13:28 Uhr, "Jeremy Ricketts" <
[email protected]>
schrieb:

Es wird jemand mit einigen tatsächlichen Programmierkenntnissen benötigt. Meine Welt besteht aus PSDs,
Bleistift und Papier sowie HTML-CSS und leichte jQuery-Arbeiten.


Antworten Sie direkt auf diese E-Mail oder zeigen Sie sie auf GitHub an:
https://github.com/cloudhead/less.js/issues/49#issuecomment -4667283

@cloudhead Falls Sie Schwierigkeiten haben, eine gute Lösung dafür zu finden, sollten Sie sich die @neonstalwart- Auflösung von vor

Grundsätzlich sollten Selektoren niemals Regeln hinzugefügt werden, wenn eine vorhandene Regel mit demselben Wert wie die aktuelle Eigenschaft vorhanden ist. Sie müssen auch den Eigenschaftswert überprüfen, da Sie bei Hintergründen möglicherweise mehrere verschiedene Hintergründe hinzufügen, da sie in verschiedenen Browsern unterschiedlich behandelt werden.

Was halten Sie von dieser Lösung @cloudhead
Scheint der Weg nach vorne zu sein?

Dies nicht zu beheben bedeutet:

1) Dateien sind größer als sie sein müssen.
2) Das Verteilen Ihres CSS auf mehrere Dateien und das Importieren von Losen ist unerwünscht, da Sie jedes Mal, wenn Sie eine zusätzliche Datei hinzufügen, die auch die Mixins enthält, die Werte dieses Mixins erneut hinzufügen. Ich habe vielleicht 80 CSS-Stile weniger, und dies bedeutet, dass, wenn ich eine .background()-Gradientenmischung durchführe, 80 * 6 zusätzliche Stile für jeden Selektor entstehen. (6, um alle verschiedenen Browser zu unterstützen).
3) Es verlangsamt auch das Seitenrendering. Meine Ziehungen/Aktualisierungen pro Sekunde sinken aufgrund der zusätzlichen Stile dramatisch.

Gedanken @cloudhead ?
Danke schön.

@cloudhead Wenn wir aus dem neuesten Commit eine Pull-Anfrage für dieses Problem stellen, werden Sie sich das Zusammenführen ansehen?

@Kalyse kannst du mir eine E-Mail [email protected]

Danke schön

Vielleicht werden einige zusätzliche vertrauenswürdige Entwickler benötigt, die Pull-Requests genehmigen können?

@cloudhead Ich verwende WinLess, um meinen WENIGER-Code zu kompilieren ... WinLess wird mit der neuesten Distribution von less.js geliefert (siehe https://github.com/marklagendijk/WinLess/issues/14) ) wird der neuesten Version hinzugefügt?

Danke (für ein tolles Produkt).

Also, ähm... Wie geht es uns damit?

@jreading Ich denke, es wurde in Git mit Commit cb7893 behoben

Scheint behoben (oder zumindest das ursprüngliche Problem ist) und wenn nicht, bin ich mir sicher, dass es einen weiteren Fehler gibt, der dies abdeckt.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen