javascript Grunt Live-Reload 通过 Watch
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16553549/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Grunt Live-Reload via Watch
提问by Ari
I'm trying to configure grunt to livereload js and less/css files on changes. While grunt does correctly "watch" and execute assigned tasks, it does not livereload the files. Below is my configuration, does anyone see what is wrong?
我正在尝试将 grunt 配置为在更改时实时重新加载 js 和 less/css 文件。虽然 grunt 可以正确地“观察”并执行分配的任务，但它不会实时重新加载文件。下面是我的配置，有人看到有什么问题吗？
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON("package.json"),
jshint: {
files: ["Gruntfile.js", "src/javascripts/**/*.js"],
options: {
globals: {
jQuery: true,
console: true,
module: true
}
}
},
concat: {
options: {
stripBanners: true,
banner: "/*! <%= pkg.name %> - v<%= pkg.version %> - <%= grunt.template.today('yyyy-mm-dd') %> */\n",
separator: "\n"
},
js: {
src: ["src/javascripts/main.js", "src/javascripts/**/*.js"],
dest: "../app/assets/javascripts/application.js"
},
less: {
src: ["src/stylesheets/**/*.less"],
dest: "../app/assets/stylesheets/application.less"
}
},
watch: {
js: {
files: ["<%= jshint.files %>"],
tasks: ["jshint", "concat:js"],
options: {
livereload: true
}
},
less: {
files: ["<%= concat.less.src %>"],
tasks: ["concat:less"],
options: {
livereload: true
}
}
}
});
grunt.loadNpmTasks("grunt-contrib");
grunt.registerTask("default", ["jshint", "concat"]);
};
Note: I have included the following script tag within the html head tag.
注意：我在 html head 标签中包含了以下脚本标签。
<script src="http://localhost:35729/livereload.js"></script>
回答by Kyle Robinson Young
Your config is trying to start 2 live reload servers on the same port. If you would like 1 live reload server to trigger on all your watch targets then just add 1 livereload option at the task level:
您的配置正在尝试在同一端口上启动 2 个实时重新加载服务器。如果您希望在所有监视目标上触发 1 个实时重载服务器，则只需在任务级别添加 1 个实时重载选项：
watch: {
options: {
livereload: true
},
js: {
files: ["<%= jshint.files %>"],
tasks: ["jshint", "concat:js"],
},
less: {
files: ["<%= concat.less.src %>"],
tasks: ["concat:less"],
}
}
回答by Shobhit
I was missing the script tag and after adding this
我错过了脚本标签并添加了这个
it started working for me. :)!
它开始对我来说有效。:)！
Thanks,
谢谢，
