2012-08-14 10 views
8

Voglio separare la mia logica applicativa in più file Javascript per la sanità mentale e la compatibilità degli sviluppatori, memorizzati nella cartella/src. Questi file dovrebbero essere linted e concatenati in /dist/app.js durante il processo di compilazione. Sto usando grunt per il mio processo di compilazione, poiché è già dotato di pratiche funzioni di lint e concat.Come si risolvono le dipendenze quando si escono singoli file javascript con grunt?

 

    + 
    |- grunt.js 
    |- readme 
    |-vendors 
     |-backbone.js 
    |- src 
     |- core.js 
     |- user.js 
    |- dist 
     |-app.js 

Sto incontrando un fastidioso problema. Uso backbone.js per la struttura dell'applicazione e la maggior parte dei miei file di origine inizia definendo modelli estendendo Backbone.Model. Quando si estraggono questi file, JSHint si lamenta che Backbone non è definito, e giustamente - backbone risiede all'esterno nella propria directory. Includere tutti gli script necessari nell'ordine corretto è qualcosa che presumo sia fatto nell'html. Ogni singolo file sorgente dovrebbe conoscere solo se stesso.

So che posso sopprimere queste indefinite avvertimenti impostando di pelucchi undef bandiera grunt.js per falso ma voglio tenerlo impostato su vero al fine di essere messo in guardia su altre variabili indefinite nella mia applicazione, in quanto è un puntatore comune agli errori di battitura. C'è un modo pulito per dire ai grunt (o ai pelucchi) quali file includere prima di sfilarli? Sto facendo qualcosa di sbagliato con il mio processo di compilazione, o con la mia architettura dell'applicazione? O è semplicemente qualcosa con cui devo convivere?

risposta

11

Le jshint opzioni consentono di specificare un elenco di variabili globali che vengono da altre biblioteche si sta utilizzando, nel file grunt.js:



    jshint: { 
     options: { 
     curly: true, 
     eqeqeq: true, 
     immed: false, 
     latedef: true, 
     newcap: true, 
     noarg: true, 
     sub: true, 
     undef: true, 
     boss: true, 
     eqnull: true, 
     browser: true 
     }, 

     globals: { 
     jQuery: true, 
     Backbone: true, 
     _: true 
     } 
    }, 

nota l'impostazione globals in fondo. Ciò consente a JSHint di ignorare queste variabili, ma esegue comunque l'impostazione undef: true (come mostrato sopra).

+0

Perfetto! Grazie! Ero abbastanza sicuro che ci fosse un modo semplice per farlo, ma la documentazione di grunt non era molto chiara e non avevo precedenti esperienze con JSHint. Grazie ancora! – timkg

+2

L'aggiunta di qualcosa come 'core.js' all'esempio' globals' nella risposta aiuterebbe la chiarezza. Venivo da una prospettiva Web Storm chiedendomi come aggiungerei elementi definiti nella mia lib prima che mi rendessi conto che potevo aggiungerli al file. Potrebbe anche voler dire che è possibile aggiungere le opzioni a un solo file con la chiave globale '/ *: valore, .. * /' sintassi – Snekse

+2

Ho continuato a ottenere "'foo' non è definito" fino a quando non ho spostato i globals oggetto all'interno dell'oggetto opzioni. –

0

Un approccio alternativo (che non si basa su grugnito) è quello di aggiungere un commento jshint nei file js:

/* global Backbone, jQuery, _ */ 
+1

E se lo script ha bisogno di assegnare un valore a un globale, aggiungi ': true' (senza spazi) dopo di esso. Ad esempio '/ * Global Backbone, jQuery: true, _ * /' –

Problemi correlati