gpt4 book ai didi

javascript - 浏览器同步 Gulp 设置不适用于 .NET MVC

转载 作者:搜寻专家 更新时间:2023-11-01 04:16:18 24 4
gpt4 key购买 nike

我正在尝试为 .NET MVC 应用程序设置一个 gulp 浏览器同步构建系统,除了每当进行更改时使用浏览器同步进行实时重新加载外,一切正常。这是我第一次尝试,所以我可能会做一些简单的错误。这是我的 gulpfile.js

var gulp = require('gulp'),
uglify = require('gulp-uglify'),
jshint = require('gulp-jshint'),
watch = require('gulp-watch'),
livereload = require('gulp-livereload'),
browserSync = require('browser-sync'),
concat = require('gulp-concat');

//minify js
gulp.task('minifyJS', function () {
gulp.src('Scripts/**/*.js')
.pipe(concat('app.js'))
.pipe(gulp.dest('Scripts'))
});

gulp.task('minifyCSS', function () {
gulp.src('Content/**/*.css')
.pipe(concat('app.css'))
.pipe(gulp.dest('Content'))
});

//browsersync
gulp.task('browserSync', function () {
var files = [
'Scripts/**/*.js',
'Content/**/*.css',
'Views/**/*.cshtml'
];

browserSync.init(files, {

proxy: "http://localhost:55783/"
});
});

//default task wraps the two
gulp.task('default', ['minifyJS', 'minifyCSS', 'watch', 'browserSync']);

//watch tasks
gulp.task('watch', function () {
var jsWatcher = gulp.watch('Scripts/**/*.js', ['minifyJS']);
var cssWatcher = gulp.watch('Content/**/*.css', ['minifyCSS']);

jsWatcher.on('change', function (event) {
console.log('Event type: ' + event.type); // added, changed, or deleted
console.log('Event path: ' + event.path); // The path of the modified file
});

cssWatcher.on('change', function (event) {
console.log('Event type: ' + event.type); // added, changed, or deleted
console.log('Event path: ' + event.path); // The path of the modified file
});
});

当我运行 gulp watch 时工作正常,因为行记录到控制台,只是没有实时重新加载。我翻了几篇博文都无济于事,有什么想法吗?

编辑:Browser-Sync 从代理启动站点,每当我更改列出目录中的 CSS 或 JS 文件时,gulp watch 会接收它,但 Browser-Sync 不会。我必须手动刷新

最佳答案

试试这个:

gulp.task('watch', function () {
function reportChange(event){
console.log('Event type: ' + event.type); // added, changed, or deleted
console.log('Event path: ' + event.path); // The path of the modified file
}

gulp.watch('Content/**/*.css', ['minifyCSS', browserSync.reload]).on('change', reportChange);
gulp.watch('Scripts/**/*.js', ['minifyJS', browserSync.reload]).on('change', reportChange);
});

如果您需要一个示例,您可以在这个框架应用程序存储库中看到: https://github.com/aurelia/skeleton-navigation/blob/master/build/tasks/watch.js

(我已经链接了 Watch 任务,但如果您需要更多示例,您可以导航到其他任务!)

关于javascript - 浏览器同步 Gulp 设置不适用于 .NET MVC,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29750358/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com