Verwendung von Sass in Django und Versionierung von CSS und JS Assets für Cache - Zerschlagung

Question

Also habe ich ein Projekt in Laravel/MySQL gestartet und es wurde nach Gesprächen mit erfahrenen Entwicklern offensichtlich, dass Django/PostgreSQL eine bessere Wahl für die App

Obwohl ich ein Django-Newb bin, habe ich es über Django konvertiert und es gibt eine Funktion in Laravel, die ich in Django nicht sehe, die ich mich gefragt habe, wie ich sie implementieren soll. In Laravel ist es eine Kombination aus Gulp und Elixir, die Sass CSS-Kompilierung und auch Versionierung von CSS- und JS-Dateien verwaltet.

In gulpfile.js für Laravel ist der Code folgendermaßen aus:

elixir((mix) => { 
    mix.sass('styles.scss') 
     .version(['css/app.css', 'js/app.js', 'css/styles.css', 'js/custom.js']); 
}); 

Es wird dann in die Blade-Vorlage lesen mit:

<!-- Styles --> 
<link rel="stylesheet" href="{{ elixir('css/app.css') }}"> 
<link rel="stylesheet" href="{{ elixir('css/styles.css') }}">  

<!-- Scripts --> 
<script src="{{ elixir('js/app.js') }}"></script> 
<script src="{{ elixir('js/custom.js') }}"></script> 

ich eine ähnliche Funktionalität in Django zu sehen bin nicht so frage mich, wie um es zu implementieren, weil es sehr praktisch ist, watch auf dann Assets Sass-> CSS und JS kompiliert und versioniert zu drehen.

ich sehe verschiedene npm Pakete gibt: gulp, gulp-django, django-sass usw. Und dann sehe ich andere Pakete wie gulp-buster oder gulp-cache-bust. Es ist mir nicht klar, ob gulp mit diesen Paketen geliefert wird, ob sie zusätzlich zu gulp heruntergeladen werden müssen, oder ich brauche nur eine django spezifische gulp.

Dargestellt jemand hier würde wissen, wie man ähnliche Funktionalität der Gulp/Elixir Kombination in Laravel hinzufügen.

Answer 1

Ich verwende django_assets für diese. Für meine CSS und SASS Dateien, verwende ich eine assets.py-Datei, die wie folgt aussieht:

css_bundle = Bundle(
    'scss/main.scss', 
    depends=('scss/**/*.scss',), 
    filters='pyscss,cssmin', 
    output='compiled/main.min.css' 
) 

register('css_bundle', css_bundle) 

die ich dann in meine Vorlagen wie diese können sein:

{% assets "css_bundle" %} 
    <link rel="stylesheet" href="{{ ASSET_URL }}"/> 
{% endassets %} 

Cache-Busting ist bereits eingebaut, und Sie können etwas ähnliches für JS-Dateien tun.