Tải bản tải xuống để làm việc với Sails.js

Question

Tôi mới sử dụng cả Sails và grunt nên tôi có thể thiếu thông tin rõ ràng. Tôi đang cố gắng tự động làm mới ứng dụng buồm trong trình duyệt bất cứ khi nào tệp thay đổi.

Tôi khởi động ứng dụng với sails lift và nó chạy trên cổng mặc định 1337.

Tôi đã thử thêm options: {livereload:true} vào cấu hình grunt-contrib-watch của mình nhưng theo như tôi hiểu tôi cần phải bằng cách nào đó tiêm JavaScript tải trọng vào trang của tôi?

Tôi đã cố gắng sử dụng grunt-contrib-connect với tùy chọn livereload để chèn JavaScript nhưng dường như chỉ bắt đầu một máy chủ khác. Khi tôi điều hướng đến máy chủ bắt đầu (localhost:8000), tôi chỉ thấy cấu trúc thư mục. Tuy nhiên, JavaScript tải gan được tiêm.

Tôi muốn tránh tải xuống trình cắm Chrome Plugin nếu có thể.

Cách tốt nhất để chèn JavaScript tải lên ứng dụng Sails của tôi là gì? Hoặc tôi nên sử dụng một công cụ khác như Browsersync?

Cảm ơn bạn! :)

Answer 1

1. Thêm tùy chọn livereload để nhiệm vụ/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. Thêm script livereload để bố trí của bạn, đâu đó ở cuối trước </body> thẻ, theo mặc định để views/layout.ejs:

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

Trừ của localhost bạn có thể sử dụng IP hoặc DNS tên của máy chủ

này sẽ làm mới trang nếu một tập tin được thay đổi trong api hoặc tài sản thư mục.

Theo mặc định Ggrunt-contrib-watch sử dụng cổng. Bạn có thể trỏ cổng khác như livereload: 8000

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

EDIT: Vâng, tôi thực sự không biết nếu điều này là hoàn toàn chính xác, nhưng có vẻ như bạn có thể ghi đè lên các thiết lập bố trí trong config/env/development.js. Thêm một cái gì đó như:

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

Sau đó bạn có thể tạo tệp bố cục riêng biệt views/dev.ejs nơi bạn có thể thêm tập lệnh tải xuống và thông số phát triển khác. Ngoài ra, bạn có thể thêm khóa livereload theo cách tương tự.

Answer 2

Sau khi mất một chút thời gian, hãy cài đặt plugin trình duyệt ganel (http://livereload.com/extensions/) cho .html, js và css và gói (https://www.npmjs.com/package/sails-hook-autoreload) cho các kiểu máy và bộ điều khiển.

Hoạt động như một sự quyến rũ.