【问题标题】:grunt serve - live reload only works in app/*.html but not in app/views/*.htmlgrunt serve - 实时重新加载仅适用于 app/*.html 但不适用于 app/views/*.html
【发布时间】:2014-08-02 17:42:01
【问题描述】:

我是 yeoman、grunt 和 bower 的新手。 我用 yeoman 制作了一个 Angular 应用程序,现在我尝试编辑 gruntfile.js。但是实时重新加载仅适用于“app”文件夹中的文件。在“app/views/”之类的文件夹中,它不会实时重新加载我的页面。 grunt 服务器注意到更改,我可以在控制台输出中看到这一点(文件“app\views\partial1.html”已更改。)但不会发生实时重新加载。 谁能告诉我如何解决这个问题。我用谷歌搜索了很多,但不知何故我没有解决这个问题。 这是我在 gruntfile.js 中的观察部分:

// Watches files for changes and runs tasks based on the changed files
    watch: {
        bower: {
            files: ['bower.json'],
            tasks: ['wiredep']
        },
        js: {
            files: ['<%= yeoman.app %>/scripts/{,*/}*.js'],
            tasks: ['newer:jshint:all'],
            options: {
                livereload: '<%= connect.options.livereload %>'
            }
        },
        jsTest: {
            files: ['test/spec/{,*/}*.js'],
            tasks: ['newer:jshint:test', 'karma']
        },
        styles: {
            files: ['<%= yeoman.app %>/styles/{,*/}*.css'],
            tasks: ['newer:copy:styles', 'autoprefixer']
        },
        gruntfile: {
            files: ['Gruntfile.js']
        },
        livereload: {
            options: {
                livereload: '<%= connect.options.livereload %>'
            },
            files: [
                '<%= yeoman.app %>/{,*/}*.html',
                '.tmp/styles/{,*/}*.css',
                '<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
            ]
        }

提前感谢您的帮助!!

【问题讨论】:

  • 你是用grunt serve还是grunt serve:dist启动服务器?
  • 我用 grunt serve 启动服务器

标签: javascript angularjs gruntjs


【解决方案1】:

**/ 替换所有{,*/} 大括号扩展。所以代码应该是这样的:

// Watches files for changes and runs tasks based on the changed files
watch: {
    bower: {
        files: ['bower.json'],
        tasks: ['wiredep']
    },
    js: {
        files: ['<%= yeoman.app %>/scripts/**/*.js'],
        tasks: ['newer:jshint:all'],
        options: {
            livereload: '<%= connect.options.livereload %>'
        }
    },
    jsTest: {
        files: ['test/spec/**/*.js'],
        tasks: ['newer:jshint:test', 'karma']
    },
    styles: {
        files: ['<%= yeoman.app %>/styles/**/*.css'],
        tasks: ['newer:copy:styles', 'autoprefixer']
    },
    gruntfile: {
        files: ['Gruntfile.js']
    },
    livereload: {
        options: {
            livereload: '<%= connect.options.livereload %>'
        },
        files: [
            '<%= yeoman.app %>/**/*.html',
            '.tmp/styles/**/*.css',
            '<%= yeoman.app %>/images/**/*.{png,jpg,jpeg,gif,webp,svg}'
        ]
    }

作为参考,** 是一种通配模式。 Grunt documentation 很好地描述了这一点:

大多数人需要知道的是foo/*.js 将匹配 foo/ 子目录中所有以 .js 结尾的文件,但 foo/**/*.js 将匹配 foo/ 子目录及其所有子目录中所有以 .js 结尾的文件.

【讨论】:

  • OP 声明 grunt-watch 已经检测到该文件的更改。我怀疑这会有所帮助。
猜你喜欢
  • 2014-10-13
  • 2019-11-16
  • 1970-01-01
  • 1970-01-01
  • 2012-06-18
  • 1970-01-01
  • 2021-12-03
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多