使用MAMP的Gulp和browserSync配置:在重新加载浏览器时卡住

MAMP是一种用于搭建本地开发环境的软件，它集成了Apache服务器、MySQL数据库和PHP解释器。Gulp是一个基于Node.js的自动化构建工具，可以帮助开发者在开发过程中自动化执行一系列任务，如编译Sass、压缩JS等。browserSync是一个强大的浏览器同步测试工具，可以在多个设备上同步刷新浏览器。

要在MAMP中配置Gulp和browserSync，可以按照以下步骤进行操作：

确保已经安装了Node.js和npm（Node.js的包管理器）。
在项目根目录下创建一个package.json文件，可以通过运行npm init命令来生成该文件，并按照提示填写相关信息。
安装所需的Gulp插件和browserSync插件，可以通过运行以下命令来安装：

npm install gulp gulp-sass gulp-uglify browser-sync --save-dev

这里安装了gulp、gulp-sass、gulp-uglify和browser-sync插件。

在项目根目录下创建一个gulpfile.js文件，该文件是Gulp的配置文件，用于定义任务和执行相关操作。在gulpfile.js中，可以按照以下方式配置Gulp和browserSync：

const gulp = require('gulp');
const sass = require('gulp-sass');
const uglify = require('gulp-uglify');
const browserSync = require('browser-sync').create();

// 编译Sass文件
gulp.task('sass', function() {
  return gulp.src('src/scss/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('dist/css'))
    .pipe(browserSync.stream());
});

// 压缩JS文件
gulp.task('uglify', function() {
  return gulp.src('src/js/*.js')
    .pipe(uglify())
    .pipe(gulp.dest('dist/js'))
    .pipe(browserSync.stream());
});

// 启动browserSync服务
gulp.task('serve', function() {
  browserSync.init({
    server: {
      baseDir: './'
    }
  });

  gulp.watch('src/scss/*.scss', gulp.series('sass'));
  gulp.watch('src/js/*.js', gulp.series('uglify'));
  gulp.watch('*.html').on('change', browserSync.reload);
});

// 默认任务
gulp.task('default', gulp.series('sass', 'uglify', 'serve'));