5

Il mio JavaScript viene eseguito due volte. Quando eseguo il debugger di Chrome, ho notato che il singolo file JavaScript eseguirà il codice la prima volta, dopodiché il file application.js eseguirà nuovamente il codice.Pipeline di asset di rails: JavaScript in esecuzione due volte

Credo che questo stia accadendo perché di recente ho disattivato la precompilazione perché avevo problemi con Heroku. Dopo questo ho eseguito rake assets:precompile.

risposta

8

Turbolinks

È probabilmente avete un problema con Turbolinks (considerando che hai incluso nella vostra pipeline di attività); anche se questo potrebbe non essere il problema.

Turbolinks ha lo scopo di velocizzare i tempi di caricamento della pagina caricando il tag <body> delle nuove pagine con ajax, mantenendo intatto il tag <head>. Questo significa che la tua applicazione carica solo l'HTML di cui ha bisogno, ma crea problemi con il JS sulla tua pagina.

Se hai il tuo JS due volte licenziato, si potrebbe essere un segno che Turbolinks sta interferendo con il vostro JS. Poiché non hai incluso alcun esempio dallo logs, non sarò in grado di fornirti alcuna informazione specifica, ma dovresti essere in grado di testare rimuovendo l'inclusione dello dallo layout e dal file JS manifest application:

#app/views/layouts/application.html.erb 
= javascript_include_tag "application", "data-turbolinks-track" => false 

#app/assets/javascripts/application.js 
//= require turbolinks -> remove this line 

Se si esegue questa operazione, riavviare il server & ricaricare la pagina in questione. Se si tratta ancora indietro con la funzionalità errata, significa Turbolinks non è il problema (e si dovrebbe ripristinare tutte le cose che cambiato)

-

Eventi

L'altro problema che si potrebbe avere come stai chiamando/innescando i tuoi eventi. Questo potrebbe essere verso il basso per una serie di motivi, ma si dovrebbe assolutamente guardare come si sta chiamando tua JS:

#app/assets/javascripts/application.js 
$(document).on("click", ".element", function(){ 
    //your stuff here 
}); 

Deleghiamo sempre dall'elemento document del DOM ora. Anche se questo potrebbe causare alcuni problemi con le risorse, abbiamo scoperto che rende le app Rails molto più robuste con la pipeline di asset, in quanto consente di identificare realmente gli elementi sulla pagina.

Se si sta tentando di attivare un evento da un singolo oggetto sul DOM, è possibile che JS "catturi" l'evento due volte (per qualsiasi motivo), causando il problema. Prova delegando gli eventi che vengono chiamato due volte

-

Funzioni

Infine, la functions potrebbe essere il problema.

Se si dispone di anonymous functions o di funzioni per eventi specifici, è necessario assicurarsi che possano essere richiamati correttamente. Si dovrebbe fare questo usando page events in JS & Turbolinks:

#app/assets/javascripts/application.js 
var your_function = function() { 
    //stuff here 
}; 

$(document).on("page:load ready", your_function); 
+0

Non uso i turbolinks, a meno che non sia automaticamente incluso nei binari 3.2.13 – user2158382

+0

o meno che non sia incluso nel bootstrap 3 – user2158382

+2

Grazie per l'ottima spiegazione Richard –

1

ho sperimentato questo problema perché del gasdotto patrimoniale compreso sia jQuery, jQuery-UJS e rotaie-UJS:

//= require jquery 
 
//= require jquery_ujs 
 
//= require rails_ujs 
 
//= require bootstrap 
 
//= require turbolinks 
 
//= require_tree .

rails_ujs rimosso e tutto andava bene.