gulp - Gulp-Connect lists directory instead of showing index.html. Why?

Question

What is wrong with this gulp file? When it opens the browser, it does not show index.html. Instead, it lists the contents of 'dist', the directory containing index.html.

"use strict";

var gulp = require('gulp');
var connect = require('gulp-connect'); // Runs a local dev server
var open = require('gulp-open');

var config = {
    port: 9005,
    devBaseUrl: 'http://localhost',
    paths: {
        html: './src/*.html',
        dist: './dist'
    }
};

//Start a local development server
gulp.task('connect', function() {
    connect.server({
        root: ['dist'],
        port: config.port,
        base: config.devBaseUrl,
        livereload: true
    });
});

gulp.task('open', ['connect'], function () {
    gulp.src('dist/index.html')
        .pipe(open({
            uri: config.devBaseUrl + ':' + config.port + '/', 
            app: 'chrome' }));

});

gulp.task('html', function() {
    gulp.src(config.paths.html)
        .pipe(gulp.dest(config.paths.dist))
        .pipe(connect.reload());
});

gulp.task('watch', function() {
    gulp.watch(config.paths.html, ['html']);
});

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

Answer 1

解决方案是将 gulp-connect 的版本限制为"gulp-connect": "^2.2.0",最新版本的工作方式不同，但我不知道最新版本的正确语法。当我尝试其他海报的答案时，页面按预期显示，但手表功能无法使用。

在撰写本文时，当前版本为 ^3.0.0。

如果这有所作为，我在 Windows 7 上。

[更新] 根据@SteveDavis，这已在版本 3.2.0 中修复。

Answer 2

确保 index.html 位于 src 而不是 psadmin 项目文件夹下，以便在执行时可以在那里找到它

gulp.src(config.paths.html)
.pipe(gulp.dest(config.paths.dist)

Answer 3

要安装正确版本的 gulp-connect 插件，请确保您输入 npm install --save-dev gulp-connect@2.2.0我遇到了同样的问题并改回该版本解决了它。

Answer 4

您好，问题在于您的打开任务，您基本上告诉 gulp 打开 dist 目录而不仅仅是 index.html