Question

这个gulp文件有什么问题？当它打开浏览器时，它不会显示index.html。相反，它列出了'dist'的内容，即包含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

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

Answer 3

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

Answer 4

确保index.html在src下而不是psadmin项目文件夹，因此它可以在执行时找到它

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

Gulp-Connect列出目录而不是显示index.html。为什么呢？

4 个答案: