Question

我正在设置一个Web项目，并希望将grunt用于自动化和工作流程。我有sass，jshint，jsdocs，minifiers都玩得很好但是在发布时并没有遇到麻烦。从grunt shell重新加载浏览器。

我有两个条件，我想这样做：

没有浏览器插件。（我希望它直接从回购中工作;“npm install”，“grunt”）将npm模块保持在最低限度。（理想情况下只是grunt-contrib-watch＆amp; grunt-contrib-connect）

这是我对那些2的配置：

connect: {
    options: {
        base: 'app/',
        port: '8888',
        livereload: true
    }
},

watch: {
    all: {
        files: [
            'gruntfile.js',
            'app/index.html',
            'app/partials/*.html',
            'app/styles/sass/*.scss',
            'app/scripts/*.js'
        ],
        tasks: ['default'],
        options: {
            livereload: true
        }
    }
}

在测试中我也尝试过：

connect: {
    options: {
        base: "app/",
        port: 8888,
        open: {
            target: 'app/index.html'
        }
    }
}

Watch告诉我文件何时更改，但运行默认任务（或其中的任何子任务）不会启动浏览器/页面，似乎没有重新加载。

我在grunt-open方面取得了一些成功，但是我认为在版本0.6.0之后只需要grunt-contrib-watch就可以实现它？

-----另外我也不确定是否正在运行grunt-contrib-connect ......

grunt.registerTask('serve',   ['sass', 'connect', 'watch']);
grunt.registerTask('default', ['jshint', 'serve']);

以下结果，我没有看到连接的任何时间，我猜测任务没有被测量，因为它并行运行，但这是发生了什么？

Execution Time 
loading tasks  12ms  ▇▇▇▇▇ 10%
jshint:src     78ms  ▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇▇ 62%
sass:all       11ms  ▇▇▇▇▇ 9%
watch          24ms  ▇▇▇▇▇▇▇▇▇ 19%
Total 126ms

Answer 1

好吧，不确定是不是这样，但是根据您的更新，我发现connect无法运行，因为您没有指定目标：

connect: {
    server: {  // try adding this block
        options: {
            base: 'app/',
            port: '8888',
            livereload: true
        }
    }
},

否则，这看起来大致正确，但您也可以明确说明要重新加载的端口：

watch: {
    all: {
        files: [
            // ...
        ],
        tasks: ['default'],
        options: {
            livereload: 8888  // changed...
        }
    }
}

设置grunt以启动＆amp;实时重新加载浏览器（使用最少的插件）

1 个答案: