2016-08-15 51 views
0

Okey所以我有一個功能角-expressjs項目。我試圖用吞嚥來獲得快遞項目的工作,但是當我開始使用我自己的快遞服務器時,我無法接到呼叫從谷底查看和角停止工作。如何將ExpressJs服務器調用gulpfile?

我做錯了什麼?我的服務器代碼偵聽src代碼。應該是這樣嗎?還是應該聽一些編碼的公共代碼?

gulpfile.js

var gulp = require('gulp'); 
var sass = require('gulp-sass'); 
var browserify = require('browserify'); 
var source = require('vinyl-source-stream'); 
var buffer = require('vinyl-buffer'); 
var jshint = require('gulp-jshint'); 
var browserSync = require('browser-sync').create(); 
var uglify = require('gulp-uglify'); 
var concat = require('gulp-concat'); 
var environments = require('gulp-environments'); 
var nodemon = require('gulp-nodemon'); 


gulp.task('lint', function() { 
    return gulp.src('./src/app/**/*.js') 
    .pipe(jshint()) 
    .pipe(jshint.reporter('default')); 
}); 

gulp.task('scripts', function(){ 
    return gulp.src('./src/**/*.js') 
      .pipe(uglify()) 
      .pipe(concat('vendor.min.js')) 
      .pipe(gulp.dest('./public/')); 
}); 

gulp.task('browserify', function() { 
    // Grabs the app.js file 
    return browserify('./src/app.js') 
     // bundles it and creates a file called main.js 
     .bundle() 
     .pipe(source('main.js')) 
     .pipe(gulp.dest('./public/')); 
}) 

gulp.task('copy', ['browserify','scss'], function() { 
    gulp.src(['./src/**/*.html','./src/**/*.css']) 
     .pipe(gulp.dest('./public')) 
     .pipe(browserSync.stream()) 
}); 

gulp.task('scss', function() { 
    gulp.src('./src/assets/scss/*.scss') 
     .pipe(sass().on('error', sass.logError)) 
     .pipe(gulp.dest('./src/assets/stylesheets/')); 
}); 

gulp.task('build',['lint', 'scss', 'copy', 'scripts']); 

gulp.task('server', ['build'], function() { 
    // configure nodemon 
    nodemon({ 
     // the script to run the app 
     script: './server/bin/www', 
     // this listens to changes in any of these files/routes and restarts the application 
     watch: ["server/bin/www", "server/app.js"], 
     ext: 'js' 
     // Below i'm using es6 arrow functions but you can remove the arrow and have it a normal .on('restart', function() { // then place your stuff in here } 
    }).on('restart', function(){ 
    gulp.src('./server/bin/www') 
     // I've added notify, which displays a message on restart. Was more for me to test so you can remove this 
     .pipe(notify('Running the start tasks and stuff')); 
    }); 
}); 




gulp.task('default', ['server'], function(){ 
    gulp.watch("./src/**/*.*", ["build"]); 
    gulp.watch("./public/**/*.*").on('change', browserSync.reload); 
}); 

HTML控制檯:未捕獲的錯誤:[$注射器:modulerr]

<!DOCTYPE html> 
<html ng-app="nodeTodo"> 
    <head> 
    <title>Todo App - with Node + Express + Angular + PostgreSQL</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <!-- styles --> 
    <script src="../public/main.js"></script> 
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" media="screen"> 
    <link href="stylesheets/style.css" rel="stylesheet" media="screen"> 
    </head> 
    <body ng-controller="mainController"> 

    <div class="container"> 

     <div class="header"> 
     <h1>Todo App</h1> 
     <hr> 
     <h1 class="lead">Node + Express + Angular + PostgreSQL</h1> 
     </div> 

     <div class="todo-form"> 
     <form> 
      <div class="form-group"> 
      <input type="text" class="form-control input-lg" placeholder="Enter text..." ng-model="formData.text"> 
      </div> 
      <button type="submit" class="btn btn-primary btn-lg btn-block" ng-click="createTodo()">Add Todo</button> 
     </form> 
     </div> 

     <br> 

     <div class="todo-list"> 
     <ul ng-repeat="todo in todoData"> 
      <li><h3><input class="lead" type="checkbox" ng-click="deleteTodo(todo.id)">&nbsp;{{ todo.text }}</li></h3><hr> 
     </ul> 
     </div> 

    </div> 

    <!-- scripts --> 
    <script src="http://code.jquery.com/jquery-1.11.2.min.js" type="text/javascript"></script> 
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js" type="text/javascript"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.12/angular.min.js"></script> 

    </body> 
</html> 

回答

0

這是我要做的事,使我受益匪淺幾個月:)

var gulp = require('gulp'), 
     nodemon = require('gulp-nodemon'), 
     plumber = require('gulp-plumber'), 
     livereload = require('gulp-livereload'); 
    var path = require("path"); 
    var tsc = require('gulp-typescript'); 
    gulp 

    .task('develop', function() { 

     livereload.listen(); 
     livereload({ start: true }) 
     nodemon({ 
      execMap: { 
      js: 'node --debug' 
     }, 
     script: 'app.js', 
     ext: 'html ts js', 
     stdout: false, 
     debug:true 
     }).on('readable', function() { 
     this.stdout.on('data', function (chunk) { 
      if(/^Express server listening on port/.test(chunk)){ 
      livereload.changed(__dirname); 
      } 
     }); 
     this.stdout.pipe(process.stdout); 
     this.stderr.pipe(process.stderr); 
     }); 
    }); 

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