Grunt のブラウザ同期プラグインを正しく動作させる際に、混乱する問題が発生しています。私はドキュメントを徹底的に読み、例に従いましたが、うまくいかないことがいくつかあります:
1) CSS インジェクションを受けていません。監視タスクと一緒にプラグインを実行していることはわかっていますが、watchTask: true
設定したところ、ターミナルは bS が CSS の変更を識別していることを示しています。ブラウザをリロードしていないだけです。
2) ゴースト モードのオプションがどれも機能しないようです。それらをすべてtrueに設定しましたが、livereload機能と同じように機能させることができません。
これが私の現在のGruntfileです:
'use strict';
module.exports = function (grunt) {
grunt.initConfig({
watch: {
less : {
files: ['static/css/less/*.less'],
tasks: ['less']
},
html : {
files: ['*.html']
},
js : {
files: ['static/js/*.js']
}
},
less: {
development: {
options: {
paths: ["css"],
compress: true,
yuicompress: true,
optimization: 2
},
files: {
"static/css/styles.css": "static/css/less/styles.less"
}
}
},
browserSync: {
default_options: {
bsFiles: {
src: [
"static/css/*.css",
"*.html"
]
},
options: {
watchTask: true,
server: {
baseDir: "./"
},
ghostMode: {
clicks: true,
forms: true,
scroll: true
}
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-less');
grunt.loadNpmTasks('grunt-browser-sync');
// Launch BrowserSync + watch task
grunt.registerTask('default', ['browserSync', 'watch']);
};
どんな助けでも本当に感謝します