使用gulp提供静态文件时出现TypeError错误
请求Gulp提供静态内容并加载Web服务器时，出现以下错误。 我遵循专业的angularJS书。 package.json和gulp文件都驻留在同一个文件夹中。
[21:30:44] Using gulpfile ~/Desktop/pro-angular2/gulpfile.js [21:30:44] Starting 'connect'... [21:30:44] 'connect' errored after 96 ms [21:30:44] TypeError: undefined is not a function at Gulp.<anonymous> (/home/kj/Desktop/pro-angular2/gulpfile.js:17:18) at module.exports (/home/kj/Desktop/pro-angular2/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7) at Gulp.Orchestrator._runTask (/home/kj/Desktop/pro-angular2/node_modules/gulp/node_modules/orchestrator/index.js:273:3) at Gulp.Orchestrator._runStep (/home/kj/Desktop/pro-angular2/node_modules/gulp/node_modules/orchestrator/index.js:214:10) at Gulp.Orchestrator.start (/home/kj/Desktop/pro-angular2/node_modules/gulp/node_modules/orchestrator/index.js:134:8) at /usr/local/lib/node_modules/gulp/bin/gulp.js:129:20 at process._tickCallback (node.js:355:11) at Function.Module.runMain (module.js:503:11) at startup (node.js:129:16) at node.js:814:3 下面是我的Gulp代码
var gulp = require('gulp'); var $ = require('gulp-load-plugins')(); gulp.task('default',[],function(){ }); gulp.task('connect', function() { var serveStatic = require('serve-static'); var serveIndex = require('serve-index'); var connect = require('connect'); var app = connect() .use(require('connect-livereload')({ port: 35729 })) .use(connect.serveStatic('app')) .use(connect.serveIndex('app')); require('http').createServer(app) .listen(9000) .on('listening', function() { console.log('Started connect web server on http://localhost:9000'); }); });
和我的package.json文件
{ "name": "pro-angular2", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "devDependencies": { "connect": "^3.4.0", "connect-livereload": "^0.5.4", "grunt": "^0.4.5", "grunt-contrib-connect": "^0.11.2", "grunt-contrib-jshint": "^0.11.3", "grunt-contrib-less": "^1.1.0", "grunt-contrib-watch": "^0.6.1", "gulp": "^3.9.0", "gulp-jshint": "^2.0.0", "gulp-less": "^3.0.5", "gulp-livereload": "^3.8.1", "gulp-load-plugins": "^1.1.0", "jshint": "^2.8.0", "load-grunt-tasks": "^3.3.0", "opn": "^3.0.3" } }
这是树形视图
. |-- app | |-- app.js | |-- bower_components | |-- index.html | |-- main.css | `-- main.less |-- bower.json |-- gruntfile.js |-- gulpfile.js |-- node_modules | |-- connect | |-- connect-livereload | |-- grunt | |-- grunt-contrib-connect | |-- grunt-contrib-jshint | |-- grunt-contrib-less | |-- grunt-contrib-watch | |-- gulp | |-- gulp-jshint | |-- gulp-less | |-- gulp-livereload | |-- gulp-load-plugins | |-- jshint | |-- load-grunt-tasks | |-- opn | |-- serve-index | `-- serve-static `-- package.json
server-static和server-static serve-index不再是connect一部分。 他们被提取作为单独的模块。 你有这些单独的模块，所以只需使用：
.use(serveStatic('app')) .use(serveIndex('app'));