Question

我在Node环境中，为SASS运行gulp，为模板运行EJS，我也想让Browser Sync运行。我在配置gulp文件时遇到问题。如果我运行节点server.js＆＃39;我的应用程序在浏览器中运行，EJS正常运行，但我没有使浏览器同步工作。如果我跑了一口气，我会得到“无法获得/＆＃39;在浏览器中。

请注意我是Node的新手，所以如果你能在答案中加入任何解释，这将有助于我学习和非常感激！

这是我的gulpfile：

var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync').create();
var runSequence = require('run-sequence');
var ejs = require("gulp-ejs");

gulp.task('default', function(callback) {
  runSequence(['browserSync', 'watch', 'ejs'], callback);
});

gulp.task('ejs', function(){
  return gulp.src('views/html/**/*.ejs')
   .pipe(ejs({}, {ext:'.html'}))
   .pipe(gulp.dest('dist/html/'));
});

gulp.task('sass', function() {
  return gulp.src('sass/**/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('public/css/sass'))
    .pipe(browserSync.reload({
      stream:true
    }));
});

gulp.task('watch', ['browserSync', 'ejs'], function() {
  gulp.watch('./scss/*.scss', ['sass']);
  gulp.watch('./views/html/**/*.html', browserSync.reload);
  gulp.watch('./views/html/**/*.ejs', browserSync.reload);
  gulp.watch('./public/js/**/*.js', browserSync.reload);
  gulp.watch('views/html/**/*.ejs', ['ejs']);
});

gulp.task('browserSync', function() {
  browserSync.init({
    server: {
      baseDir: './'
    },
  });
});

这是server.js ：

var express = require('express');
var app = express();
var gulp = require('gulp');

gulp.task('default', function(arg) {

});

// set the view engine to ejs
app.set('view engine', 'ejs');

// use res.render to load up an ejs view file

// index page
app.get('/', function(req, res) {
    res.render('index');
});


app.listen(3000);

Answer 1

尝试使用代理初始化进行测试

gulp.task('browser-sync', function() {
    browserSync.init({
        proxy: "yourlocal.dev"
    });
});

浏览器同步，EJS，Gulp和节点 - 获取设置

1 个答案: