Ottieni livereload per lavorare con Sails.js

Question

Sono nuovo per entrambe le vele e il grugnito quindi potrei mancare all'ovvio. Sono cercando di aggiornare automaticamente l'app delle mie vele nel browser ogni volta che i file cambiano.

Avvio l'app con sails lift e viene eseguita sulla porta predefinita 1337.

Ho provato ad aggiungere options: {livereload:true} alla mia configurazione grunt-contrib-watch ma, per quanto ho capito, ho bisogno di iniettare in qualche modo il codice JavaScript nella mia pagina?

Ho provato a utilizzare grunt-contrib-connect con l'opzione livereload per iniettare il codice JavaScript ma sembra che venga avviato solo un altro server. Quando si accede al server avviato (localhost:8000), vedo solo la struttura delle cartelle. Tuttavia, viene iniettato il JavaScript fegato.

Desidero evitare il plugin Chromeelo livereload se possibile.

Qual è il modo migliore per iniettare il JavaScript fegato nel mio app Sails? O dovrei semplicemente usare un altro strumento come Browsersync?

Grazie! :)

Answer 1

1. Aggiungi opzione livereload a compiti/config/watch.js

module.exports = function(grunt) { 

    grunt.config.set('watch', { 
     api: { 

      // API files to watch: 
      files: ['api/**/*', '!**/node_modules/**'] 
     }, 
     assets: { 

      // Assets to watch: 
      files: ['assets/**/*', 'tasks/pipeline.js', '!**/node_modules/**'], 

      // When assets are changed: 
      tasks: ['syncAssets' , 'linkAssets'] 
     }, 
     // ADD THIS 
     options: { 
      livereload: true, 
     }, 
    }); 

    grunt.loadNpmTasks('grunt-contrib-watch'); 
}; 

2. Aggiungi sceneggiatura livereload al layout, da qualche parte alla fine prima </body> tag, per impostazione predefinita per vista/layout.ejs:

<script src="http://localhost:35729/livereload.js"></script> 

eccezione di localhost è possibile utilizzare il nome IP o DNS del server di

Questa si aggiorna pagina se un file viene modificato in api o beni cartella.

Per impostazione predefinita, Ggrunt-contrib-watch utilizza la porta . Si può puntare altra porta come livereload: 8000

• Similar question, but not so detailed answer
• Ggrunt-contrib-watch docs

EDIT: Beh, non so se questo è del tutto corretto, ma sembra che è possibile ignorare le impostazioni di layout in config/env/development.js. Aggiungere qualcosa di simile:

module.exports = { 
    views: { 
     layout: 'dev' 
    } 
} 

Quindi è possibile creare file di layout separata views/dev.ejs cui è possibile aggiungere lo script livereload e altri params di sviluppo. Inoltre è possibile aggiungere la chiave livereload allo stesso modo.

Answer 2

Dopo aver perso un po 'di tempo cercando di farlo con vele/grunt, installo il plugin per il browser livereload (http://livereload.com/extensions/) per .html, js e css e il pacchetto (https://www.npmjs.com/package/sails-hook-autoreload) per i modelli e i controller.

Funziona come un fascino.