javascript - Grunt 在编辑 js 文件后应用更改

标签 javascript node.js

我使用 Grunt 创建了第一个项目。我有一个问题,因为编辑 js 文件后我需要重新启动服务器才能应用更改。当我编辑 JADE 文件时,我不需要重新启动服务器。还有一个问题:文件更改后如何添加自动刷新浏览器?

我的 grunt 文件:

'use strict';

module.exports = function (grunt) {
    // show elapsed time at the end
    require('time-grunt')(grunt);
    // load all grunt tasks
    require('load-grunt-tasks')(grunt);

    grunt.initConfig({
        reload: {
            port: 9000,
            proxy: {
                host: 'localhost'
            }
        },
        // Watch Config
        watch: {
            files: ['views/**/*','routes/*'],
            taksks: 'workon reload',
            options: {
                nospawn: true // Without this option specified express won't be reloaded
            },
            express: {
                files:  [ 'app.js', '!**/node_modules/**', '!Gruntfile.js' ],
                tasks:  [ 'express:dev' ],
                options: {
                    nospawn: true // Without this option specified express won't be reloaded
                }
            }
        },


        // Clean Config
        clean: {
            dist: {
                files: [{
                    dot: true,
                    src: [
                        '.tmp',
                        'dist/*',
                        '!dist/.git*'
                    ]
                }]
            },
            server: ['.tmp']
        },
        // Express Config
        express: {
            options: {
              // Override defaults here
            },
            dev: {
                options: {
                    script: './bin/www'
                }
            }
        },
        // Open Config
        open: {
            site: {
                path: 'http://localhost:9000',
                app: 'chrome'
            }
        }

    });

    // Register Tasks
    // Workon
    grunt.registerTask('workon', 'Start working on this project.', [
        'express:dev',
        'open:site',
        'watch'
    ]);


    // Restart
    grunt.registerTask('restart', 'Restart the server.', [
        'express:dev',
        'open:site',
        'reload',
        'watch'

    ]);


    // Build
    grunt.registerTask('build', 'Build production ready assets and views.', [
        'clean:dist',
        'concurrent:dist',
        'useminPrepare',
        'imagemin',
        'concat',
        'cssmin',
        'uglify',
        'copy:dist',
        'rev',
        'usemin',
    ]);

    grunt.loadNpmTasks('grunt-express-server');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-open');
    grunt.loadNpmTasks('grunt-reload');


};

编辑:重新加载服务器页面后加载速度非常慢:

enter image description here

为什么?

最佳答案

  livereload: {
        options: {
          livereload: '<%= connect.options.livereload %>'
        },
        files: [

        ]
      }

我认为这部分 watch 可以帮助你

关于javascript - Grunt 在编辑 js 文件后应用更改,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36713086/

相关文章:

javascript - react setstate接受的对象在setInterval和onClick中是不同的

javascript - 如何仅使用 javascript/CSS 阻止 UI 直到页面加载等待图像

javascript - 预订系统的障碍

javascript - NodeJS everyauth 获取访问 token

windows - 在 Windows 上运行 grunt.cmd 的多个问题

javascript - 服务 Headless Webkit 的最熟练方法

javascript - 如何应用“加载更多”以在 WordPress 模板中获取自定义帖子

javascript - 内部左侧导航

javascript - 如何从数组 [JavaScript] 中获取对象的索引?

node.js - ejs 'partial is not defined'