0

I'm using Laravel as my back-end framework, I would like to have live reloading when some file's modification occurs. I still don't successfully configure the Gruntfile.js to make it works.

I think, I should need 2 plugins, grunt-contrib-watch and grunt-contrib-connect, and I have configured Grutnfile.js as follow.

module.exports = function(grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),

        watch: {
            options: {
                livereload: true
            },
            page: {
                files: ['*.php', '*.html'],
                tasks: ['connect']
            }
        },

        connect: {
            options: {
                port: 8000,
                protocol: 'http',
                hostname: '*',
                livereload: true
            }
        }
    });

    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-connect');

    grunt.registerTask('do-server', ['watch']);
    grunt.registerTask('do-connect', ['connect']);
};

Please help me to get things right, when things get right, I only have to run as grunt do-connect then grunt will launch the browser for me or I have to open browser and browser to the specified ports manually???

Thanks.

4

1 回答 1

5

connect是一个静态文件服务器。它不解析和提供 PHP 文件；只提供静态文件。您可以添加中间件来转换这些文件，因为它为它们提供服务，但如果使用 PHP，则不太可能是您需要的。

您可能会使用 nginx 或 apache 作为您的服务器。PHP >= 5.4 也有一个内置的网络服务器。所以另一个选择是grunt-php而不是 connect。

grunt-contrib-connect 和 grunt-php 都不会进行实时重新加载。实时重新加载全部由 grunt-contrib-watch 处理。配置将在后台等待的livereload: true端口上启动服务器。35729

接下来，将脚本标签：添加<script src="//localhost:35729/livereload.js"></script>到您的 PHP 页面。http://localhost:5000然后通过您的站点所在的域/端口或任何位置访问该页面。这将为实时重新加载服务器创建一个 Web 套接字。更改文件后，监视任务将通知实时重新加载服务器，然后该服务器将通过 Web 套接字通知您的浏览器。

如果您不想将脚本标签添加到您的页面，您可以安装浏览器扩展。有关更多信息，请参阅 grunt-contrib-watch 任务文档：https ://github.com/gruntjs/grunt-contrib-watch#enabling-live-reload-in-your-html

于 2014-01-20T06:43:32.470 回答