Korzystanie z narzędzi Yeoman/Brunch z hybrydową aplikacją Django/Backbone?

Question

Buduję hybrydową aplikację internetową z Django na zapleczu i Backbone na przednim końcu.

Struktura jest następująca: Generuję cały kod HTML w szablonach Django, używam request.is_ajax, aby zdecydować, które szablony powrócić, i użyć Backbone do ściągnięcia HTML w razie potrzeby (robię to, ponieważ chcę obsługiwać użytkowników innych niż JavaScript).

W każdym razie, moje pytanie jest takie. Jak mój kod JavaScript staje się bardziej skomplikowane, chciałbym być w stanie wykonać następujące czynności automatycznie:

• Asynchronous JavaScript załadunku
• złączenie i minifying pliki CSS
• złączenie i minifying plików JavaScript
• JS -linting

Nie martwię się zbytnio optymalizacją obrazu ani zarządzaniem pakietami. Czy to możliwe przy konfiguracji, którą mam? Obecnie jest to standardowa aplikacja Django:

/media 
    /js 
    main.js <-- Backbone code is in here 
    /plugins 
     backbone.js 
     underscore.js 
    /css 
    main.css 
    results.css 
    /img 
/myapp 
    admin.py 
    models.py 
    views.py 
/templates 
    /myapp 
    index.html <-- references to all JS and CSS files here 

Nie jestem pewien, czy należy używać Yeoman (lub tylko grunt) lub Brunch, czy istnieje prostszy sposób. Cokolwiek używam, nie jestem pewien, czy mogę po prostu umieścić go w katalogu js, czy lokalizacja szablonów będzie komplikować rzeczy.

Obecnie wiem, jak używać require.js do asynchronicznego ładowania JS, ale nie wiem jak się łączyć, strzępków itp. - stąd szukam narzędzia. Może powinienem napisać skrypt powłoki :)

Answer 1

Mogę doradzić, aby zacząć od prostego stęknięcia. Istnieje grunt zadanie dla wszystkich Twoich potrzeb:

• grunt-contrib-usemin wola zastępuje odniesienia do oryginalnych plików z zoptymalizowanymi Vers
• grunt-contrib-uglify będzie minify twój JavaScript
• grunt-contrib-mincss będzie minify twój CSS
• grunt-contrib-jshint biegnie jshint na swoje Pliki JavaScript
• użyj requireJs, aby wczytać pliki ansynchroniczne i , aby skompilować pliki do jednego pliku, jeśli to konieczne

Answer 2

Mogę zacząć od zwykłego brunchu. Brunch jest prostszy niż chrząknięcie, ponieważ jego wtyczki działają poprawnie po wyjęciu z pudełka, bez potrzeby pisania 500-liniowych plików-gruntów. Jest również znacznie szybszy, rekompilacja aplikacji zostanie wykonana natychmiast.

Twoja konfiguracja powinna wyglądać następująco

public/   # The directory with static files which is generated by brunch. 
    app.js  # Ready to be served via webserver. 
    app.css  # Don’t change it directly, just run `brunch watch --server`. 
    assets/  # And then all changed files in your app dir will be compiled. 
    images/ 

frontend/  # Main brunch application directory. Configurable, of course. 
    app/   # Your code will reside here. 
    assets/  # Static files that shall not be compiled 
     images/ # will be just copied to `public` dir. 
    views/  # Create any subdirectories inside `app` dir. 
     file-1.js # JS files will be automatically concatenated to one file. 
    file-2.js # They will be also usable as modules, like require('file-2'). 
    file-1.css # CSS files will be automatically concatenated to one file. 
    stuff.css # JS and CSS files may be linted before concatenation. 
    tpl.jade # You may have pre-compiled to JS templates. Also with `require`. 
    vendor/  # All third-party libraries should be put here. JS, CSS, anything. 
    scripts/ # They will be included BEFORE your scripts automatically. 
     backbone.js 
     underscore.js 
    package.json # Contains all brunch plugins, like jshint-brunch, css-brunch. 
    config.coffee # All params (you can concat to 2, 5, 10 files etc.) 
       # are set via this config. Just simple, 15 lines-of-code config. 

Aby utworzyć nową aplikację, przyjrzeć brunch skeletons które są niczym podstawowych boilerplates. Wybierz dowolny, a następnie użyj brunch new --skeleton <url>, uruchom brunch watcher z brunch watch --server i jesteś gotowy. Kiedy chcesz wdrożyć aplikację, po prostu buduj rzeczy przy pomocy brunch build --optimize, która automatycznie zminimalizuje pliki.