Wie kann ich allgemeine Stilinformationen (CSS, Bilder usw.) auf MVC-Sites teilen?

8

Es ist einfach, die Funktionalität für mehrere MVC-Projekte freizugeben. Sie fügen den Code einfach in ein eigenes Projekt ein und referenzieren ihn in so vielen Lösungen, wie Ihr Herz begehrt. Sauber, Standard, herrlich.

Gibt es irgendwelche Möglichkeiten, dies für den Styling-Code zu tun? Ich hätte gerne unsere gemeinsamen CSS-Dateien, die unseren Anwendungen ein ähnliches Aussehen und Verhalten geben, an nur einem Ort. Im Moment muss ich neue Kopien für jede neue Anwendung erstellen. Wenn also etwas repariert werden muss, muss es ein Dutzend Mal an einem Dutzend Stellen repariert werden.

Hat jemand anderes damit zu tun gehabt? Ich kann die CSS-Dateien nicht in ihr eigenes Projekt trennen, und ich möchte auch nicht wirklich eine Webanwendung haben, die nur irgendwo sitzt, so dass alle Anwendungen die Dateien über vollqualifizierte Fernzugriffe nutzen können URLs. Gibt es einen TFS-Trick, den Sie mit der Quellcodeverwaltung durchführen können, um die Dateien miteinander zu verknüpfen? Gibt es etwas, an das ich nicht gedacht habe?

    
RedBrogdon 20.12.2012, 18:54
quelle

7 Antworten

2

1 - Schauen Sie in CSS-Template-Systeme wie erwähnt:

SASS-Lang Weniger

Ссылка (wirklich guter Artikel zum Starten, viele verwandte Artikel in seinem verwandten Post-Widget)

Damit können Sie Ihre Stylesheets auf organisierte Weise codieren. Sie können schnell dynamische Konfigurationen und globale Änderungen schnell hinzufügen.

2 - Entwickeln Sie Ihr eigenes globales CSS-Auflistungssystem:

Wenn Sie das obige CSS-Stylesheet-System nicht verwenden möchten. Beispiel

%Vor%

sogar ...

%Vor%

In diesen, die gleiche Form Padding, Tabelle und tr und andere Padding-Regeln. Beispiel

%Vor%

Ich weiß, dass ich wie Framework-Mentalität klingt, aber es funktioniert ..

Sie können die globalen Einstellungen schnell ändern, um sicherzustellen, dass alle Seiten aktualisiert werden.

Die CDN-Speicher- und Kompassvorschläge sind ebenfalls gültig. Sie sehen, dass das Speichern auf einem CDN die Sorgen über Anwendungsfehler / -geschwindigkeit / -last erspart.

Ihre Bewerbung kann einfach wie

sein %Vor%

3 - Konfiguration des Ansatzes

Ich persönlich denke, dass die Frage nach dem Ansatz Ihrer gesamten Entwicklungsmethodik sein sollte. Es ist eine gute Idee, CSS in einer CDN-Anwendung zu haben oder ein CSS auf einem separaten Server zu haben, der sich mit dem CDN für den Produktions-Live-Modus synchronisiert - die Trennung und Pflege über eine Stylesheet-Sprache ist sogar noch besser. Sie können dann schnell Skins, CSS-Bibliotheken, Bildbibliotheken und mehr verwenden. Hält Sachen organisiert, schneller und viel besser und GENUG, um zu sehen, und ist stolz auf das Kodieren mit.

Halten Sie es und verwenden Sie ein besseres System, was benötigt wird. Sie sollten Handbuch und den klassischen Ansatz einer Ordnerstruktur IMO verwenden. Sie müssen sich keine Sorgen mehr machen über reaktionsschnelles Anwendungsdesign für mobile / Tablet- und andere Probleme mit der Aktualisierung einer CSS-Zeile für alle Apps oder sogar einzelne Apps - sogar Sprachen und Umgang mit Multi-Site-Entwicklungsteams.

JUST MY HUMBLE MEINUNG

würde auch dringend eine CSS-Stylesheet-Sprache empfehlen, sicher, dass viele Leute sie hassen. Aber sie werden ziemlich nützlich, besonders SAAS, es ist kein Hype wie NodeJS ... es funktioniert tatsächlich. Und tut Wunder. Schauen Sie sich TopShop, GorgeousCouture ... Arcadia-Sites .. mehrere Sprachen, mehrere Währungen .. Server und Teams arbeiten an der gleichen Marke und mehrere Anwendungen für jeden Laden ..

    
TheBlackBenzKid 20.12.2012, 19:47
quelle
4

Hier ist die "tote einfache" Lösung für die Freigabe von Web-Ressourcen zwischen Projekten ohne Verwendung von CDN, LESS, SASS, NuGet, etc:

  1. Erstellen Sie gemeinsame Lösungsordner , die die freigegebenen Ressourcen enthalten, oder benennen Sie einfach eines der Projekte als Master.
  2. Verwenden Sie "Als Verknüpfung hinzufügen", um die freigegebenen Ressourcendateien nach Bedarf zu jedem Projekt hinzuzufügen.
  3. Fügen Sie jeder Projektdatei eine AfterBuild Aufgabe hinzu, die die verknüpften Dateien in Projektordner kopiert. Dies wird nur benötigt, damit Visual Studio test / debug (F5) lokal arbeitet.

Wenn Sie die Details dazu benötigen, lesen Sie weiter.

Konfigurieren von Lösungsverzeichnissen für die freigegebenen Ressourcen

** Wenn Sie Dateien direkt von einem Projekt zu einem oder mehreren zusätzlichen Projekten freigeben, können Sie diesen Schritt überspringen.

Visual Studio-Lösungsordner müssen nicht die physischen Dateisystemordner widerspiegeln, aber dies trägt dazu bei, Ihre geistige Gesundheit zu bewahren. Erstellen Sie zuerst die Ordner in Ihrem lokalen Dateisystem und kopieren Sie die Ressourcendateien in sie. Die neuen Ordner sollten sich unter Ihrem Lösungsordner befinden. Zum Beispiel:

%Vor%

Klicken Sie in Visual Studio mit der rechten Maustaste auf den Ordner Lösungspositionen und verwenden Sie Lösungsordner hinzufügen , um die neuen Dateisystemordner zu replizieren.

Fügen Sie als Nächstes die Dateien den neuen Lösungsordnern hinzu, indem Sie mit der rechten Maustaste auf jeden Ordner klicken und Vorhandenes Objekt hinzufügen verwenden, um den Inhalt der Ordner hinzuzufügen.

Gemeinsame Ressourcen als Links hinzufügen

Klicken Sie für jedes Projekt, das die freigegebenen Ressourcen verwendet, mit der rechten Maustaste auf den Projektordner, und wählen Sie Vorhandenes Element hinzufügen . Navigieren Sie zum allgemeinen Ordner, wählen Sie die gewünschten Dateien aus, klicken Sie auf den Dropdown-Pfeil neben der Schaltfläche "Hinzufügen" und wählen Sie "Als Verknüpfung hinzufügen".

Sie erhalten möglicherweise eine Warnung zur Quellcodeverwaltung, wenn Sie Dateien hinzufügen, die sich außerhalb der Projektverzeichnisstruktur befinden. Dies kann jedoch ignoriert werden, da die verknüpfte Datei an der Quelle unter Quellcodeverwaltung steht.

Fügen Sie eine AfterBuild Aufgabe zum Kopieren von Dateien

hinzu

Wenn Sie die Anwendung auf einem Server veröffentlichen, werden die verknüpften Dateien in die Projektordner kopiert, mit denen sie verknüpft sind, und alles funktioniert wie erwartet. In der Entwicklungsumgebung befinden sich die verknüpften Dateien jedoch nicht physisch in den Projektordnern. Wenn Sie also F5 drücken, um Ihre Anwendung in VS zu testen, fehlen die freigegebenen Ressourcen.

Die einfache Lösung besteht darin, einen MSBuild-Task hinzuzufügen, um die verknüpften Dateien nach jedem Build von ihrer Quelle zu kopieren. Dies muss für jedes Projekt durchgeführt werden, das die Links für freigegebene Ressourcen enthält.

Klicken Sie mit der rechten Maustaste auf das Projekt und wählen Sie Projekt entladen . Klicken Sie mit der rechten Maustaste erneut auf das Projekt, und wählen Sie Bearbeiten & lt; Projektdateiname & gt; . Scrollen Sie nach unten und fügen Sie Folgendes hinzu (direkt über "& lt; / Project & gt;"):

%Vor%

** Kopieraufgabe angepasst von diesem Link in TheCodeDestroyers Antwort.

Speichern Sie die Projektdatei, klicken Sie mit der rechten Maustaste und wählen Sie Projekt neu laden .

    
Chris Olsen 27.10.2015 12:34
quelle
2

Warum sollte nicht nur ein Website-Host diesen Basis-Style bereitstellen, und die anderen Websites verweisen auf diese Stile? Ich sehe damit nichts falsch.

Sie könnten dazu auch eine CDN-Anwendung erstellen.

MVC App # 1

%Vor%

MVC App # 2

%Vor%     
hunter 20.12.2012 18:57
quelle
2

Nun, ich weiß nicht viel über asp.net Entwicklung, also vergib mir, wenn es nicht der Fall ist, aber

Wenn die Ressourcendateien in Ihrem Projekt Build-Aktion auf Keine oder Inhalt und In Output-Verzeichnis kopieren festgelegt sind Wenn Sie Kopieren ... verwenden, können Sie einfach den Klassenbibliothek -Typ des Projekts erstellen und alle Dateien dort platzieren (die Pfade beibehalten) und dann auf diese "Klassenbibliothek" verweisen "In jedem Projekt, das die Dateien benötigt. Jede Datei wird in jedes referenzierende Projekt auf dem Lösungs-Build kopiert.

Für Eingebettete Ressource Build-Aktion wird es auch funktionieren, aber Sie müssen eine Möglichkeit finden, die Assembly anzugeben, die diese Dateien enthält (weil sie von Assembly.GetEntryAssembly abweichen wird).

    
Gman 20.12.2012 19:47
quelle
2

Persönlich mag ich nicht oder will die CDN Lösung, als ob Sie viele Seiten haben, die von CDNs 100% up-Zeit abhängen. Nach einigen Recherchen fand ich diese Lösung, die perfekt für meinen Einsatz war. Ich hoffe, dass jeder, der nach einer Alternative sucht, eine davon ist:

Ссылка

    
TheCodeDestroyer 19.09.2013 13:28
quelle
1

Wir hatten das gleiche Problem und für unsere Zwecke haben wir alle allgemeinen CSS / JS / Bilder / Layout-Ansichten in das NuGet-Paket eingefügt und verwenden es aus jeder Anwendung, wo wir es brauchen. Es funktioniert perfekt für uns.

    
Mr. Pumpkin 15.11.2013 17:25
quelle
0

Wenn Sie Sass verwenden möchten, sind die Erweiterungen von Compass genau das Richtige.

Ссылка

Wenn eine Erweiterung als Schmuckstück gebündelt ist, können Sie die Stile, die in dem Schmuckstück enthalten sind, leicht von einem beliebigen Ort auf dem System einfügen, auf dem das Schmuckstück installiert ist. Ich habe dies kürzlich in meiner neuesten Anwendung (einem spezialisierten Mehrbenutzer-CMS, bei dem jeder Benutzer seine eigene Subdomain mit einem benutzerdefinierten Layout hat, aber alle Komponenten / Widgets in der gesamten Anwendung das gleiche Design haben) verwendet. Das Einrichten einer neuen Subdomain ist so einfach wie das Ausführen eines einzelnen Befehls und das Anpassen der Vorlage, die ich eingerichtet habe und die ein Skelett mit einem einfachen Layout hat.

Kompasserweiterungen können verwendet werden, um Bilder und JavaScript-Dateien als Teil einer Vorlage zu speichern, aber bereitgestellte Dateien werden nicht automatisch aktualisiert, wie die Stile (Vorlagen von a Die Compass-Erweiterung unterscheidet sich von den Stylesheets, da die Vorlagen zum Kopieren und die Stylesheets zum Importieren sind.

    
cimmanon 20.12.2012 19:30
quelle