gulp 服务命令后超时
Timeout after gulp serve command
我是 ReactJS 的新手并且 Gulp... .
我对 Gulp
有疑问。我的问题是,当我在终端和浏览器中写入 gulp serve
时,我的页面没有显示任何内容并且页面没有完全加载并且在加载状态很长时间后,浏览器显示:
此网页不可用
ERR_CONNECTION_TIMED_OUT
留言。
我不知道我的问题是什么?
我的package.json是:
{
"name": "projectOverview",
"version": "1.0.0",
"description": "",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "gulp serve"
},
"author": "",
"license": "MIT",
"devDependencies": {
"react": "^0.13.2",
"gulp-react": "^3.0.1",
"gulp": "^3.8.11",
"gulp-connect": "^2.2.0",
"gulp-concat": "^2.5.2",
"gulp-open": "^0.3.2",
"gulp-browserify": "^0.5.1",
"reactify": "^1.1.0"
}
}
我配置 gulpfile.js 如下:
var gulp = require('gulp'),
connect = require('gulp-connect'),
open = require("gulp-open"),
browserify = require('gulp-browserify'),
concat = require('gulp-concat'),
port = process.env.port || 3031;
gulp.task('browserify', function(){
gulp.src('./app/src/js/components/main.js')
.pipe(browserify({ transform: 'reactify' }))
.pipe(gulp.dest('./app/dist/js'));
});
//launch browser in a part
gulp.task('open', function(){
var options = {
url: 'http://localhost:' + port,
};
gulp.src('./app/index.html')
.pipe(open('',options));
});
//live reload server
gulp.task('connect', function(){
connect.server({
root: 'app',
port: port,
livereload: true
});
});
//live reload js
gulp.task('js', function(){
gulp.src('./app/dist/**/*.js')
.pipe(connect.reload());
});
//live reload html
gulp.task('html', function(){
gulp.src('./app/*.html')
.pipe(connect.reload());
});
//watch files for live reload
gulp.task('watch', function(){
gulp.watch('app/dist/js/*.js', ['js']);
gulp.watch('app/index.html', ['html']);
gulp.watch('app/src/js/**/*.js', ['browserify']);
});
gulp.task('default', ['browserify']);
gulp.task('serve', ['browserify', 'connect', 'open', 'watch']);
注意这是一个测试项目,main.js
文件是空的,它只包含pragma:
/** @jsx React.DOM */
并且应该显示 dddddd 消息,如果加载成功。
我认为我的问题出在我在 index.html 或 gulpfile.js 中设置的路径中。但是...
我的问题解决了!
我的错误来自两部分:
1。
在调用 gulp serve
之前,我必须 运行 两条命令:首先:
gulp
在那之后,
npm i
在终端。
2。
我的 Kerio VPN 在测试期间启用。断开与 VPN 帐户的连接后,一切正常!我认为 kerio 应用程序和 gulp 端口有冲突......
我是 ReactJS 的新手并且 Gulp... .
我对 Gulp
有疑问。我的问题是,当我在终端和浏览器中写入 gulp serve
时,我的页面没有显示任何内容并且页面没有完全加载并且在加载状态很长时间后,浏览器显示:
此网页不可用
ERR_CONNECTION_TIMED_OUT
留言。
我不知道我的问题是什么?
我的package.json是:
{
"name": "projectOverview",
"version": "1.0.0",
"description": "",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"start": "gulp serve"
},
"author": "",
"license": "MIT",
"devDependencies": {
"react": "^0.13.2",
"gulp-react": "^3.0.1",
"gulp": "^3.8.11",
"gulp-connect": "^2.2.0",
"gulp-concat": "^2.5.2",
"gulp-open": "^0.3.2",
"gulp-browserify": "^0.5.1",
"reactify": "^1.1.0"
}
}
我配置 gulpfile.js 如下:
var gulp = require('gulp'),
connect = require('gulp-connect'),
open = require("gulp-open"),
browserify = require('gulp-browserify'),
concat = require('gulp-concat'),
port = process.env.port || 3031;
gulp.task('browserify', function(){
gulp.src('./app/src/js/components/main.js')
.pipe(browserify({ transform: 'reactify' }))
.pipe(gulp.dest('./app/dist/js'));
});
//launch browser in a part
gulp.task('open', function(){
var options = {
url: 'http://localhost:' + port,
};
gulp.src('./app/index.html')
.pipe(open('',options));
});
//live reload server
gulp.task('connect', function(){
connect.server({
root: 'app',
port: port,
livereload: true
});
});
//live reload js
gulp.task('js', function(){
gulp.src('./app/dist/**/*.js')
.pipe(connect.reload());
});
//live reload html
gulp.task('html', function(){
gulp.src('./app/*.html')
.pipe(connect.reload());
});
//watch files for live reload
gulp.task('watch', function(){
gulp.watch('app/dist/js/*.js', ['js']);
gulp.watch('app/index.html', ['html']);
gulp.watch('app/src/js/**/*.js', ['browserify']);
});
gulp.task('default', ['browserify']);
gulp.task('serve', ['browserify', 'connect', 'open', 'watch']);
注意这是一个测试项目,main.js
文件是空的,它只包含pragma:
/** @jsx React.DOM */
并且应该显示 dddddd 消息,如果加载成功。 我认为我的问题出在我在 index.html 或 gulpfile.js 中设置的路径中。但是...
我的问题解决了!
我的错误来自两部分:
1。
在调用 gulp serve
之前,我必须 运行 两条命令:首先:
gulp
在那之后,
npm i
在终端。
2。 我的 Kerio VPN 在测试期间启用。断开与 VPN 帐户的连接后,一切正常!我认为 kerio 应用程序和 gulp 端口有冲突......