javascript 基本Gulp浏览器同步 - 观看

Posted 2021-05-03

node_modules
*lock*

# GULP:
## Browser Sync and Watch

*Install:*

- Create file on root folder `package.json` and add this code https://git.io/fAMAZ
- Create file on root folder `gulpfile.js` and add this code https://git.io/fAMAc
- Create file on root folder `.gitignore` and add this code https://git.io/fAMjx
- Run `npm install`
- Run `gulp dev` (or just `gulp`)

----

*FAST install:*

- Run 

`wget -O package.json https://git.io/fAMAZ &&  wget -O gulpfile.js https://git.io/fAMAc && wget -O .gitignore https://git.io/fAMjx && npm install`

- **Run:** `gulp`

{
  "name": "",
  "version": "1.0.0",
  "description": "",
  "main": "",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "",
  "homepage": "",
  "devDependencies": {
  },
  "dependencies": {
    "browser-sync": "^2.24.7",
    "compass-mixins": "^0.12.10",
    "gulp": "^3.9.1"
  }
}

'use strict';

const gulp = require('gulp');

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

gulp.task('serve', function () {
  browserSync.init({
    port: 8890,
    reloadDelay: 500,
    ui: false,
    open: true,
    server: {
      baseDir: './',
      directory: true
    }
  });
});

gulp.task('reload', function (done) {
  browserSync.reload();
  done();
});

gulp.task('watch', ['serve'], function () {
  gulp.watch('./**/*', { interval: 800 }, ['reload']);
});

gulp.task('default', ['watch']);

gulp.task('dev', ['watch']);