Question

我正在尝试观看sass更改，但每当我更新sass文件时，我都无法在main.css上看到任何更改。有些请建议我在这里做错了我是新来的grunt js。< / p>

 {
        "name": "test-scss",
        "version": "0.1.0",
        "devDependencies": {
            "bootstrap-sass": "^3.3.7",
            "grunt": "^1.0.1",
            "grunt-contrib-concat": "^1.0.1",
            "grunt-contrib-connect": "^1.0.2",
            "grunt-contrib-jshint": "~0.10.0",
            "grunt-contrib-nodeunit": "~0.4.1",
            "grunt-contrib-sass": "^1.0.0",
            "grunt-contrib-uglify": "~0.5.0",
            "grunt-contrib-watch": "^1.0.0"
        },
        "scripts": {
            "build-css": "node-sass --include-path scss sass/style.scss   css/main.css"
        }
    }
    /// here is my gruntjs file configuration

    module.exports = function(grunt) {
        grunt.initConfig({
            pkg: grunt.file.readJSON('package.json'),
            watch: {
                options: {
                    livereload: true
                },
                sass: {
                    files: ['**/*.scss'],
                    task: ['sass']
                },
                html: {
                    files: ['*.html']
                }
            },
            sass: {
                dist: {
                    files: {
                        'css/main.css': 'sass/style.scss'
                    }
                }
            },
            connect: {
                sever: {
                    options: {
                        keepalive: true,
                        hostname: 'localhost',
                        port: 3003,
                        base: '.',
                        open: true,
                        watch: true,
                        livereload: true
                    }
                }
            }
        });
        grunt.loadNpmTasks('grunt-contrib-watch');
        grunt.loadNpmTasks('grunt-contrib-sass');
        grunt.loadNpmTasks('grunt-contrib-connect');
        grunt.registerTask('default', ['sass', 'watch', 'connect']);
    };

Answer 1

Grunt watch是一项阻止任务，因此永远无法访问grunt connect。

grunt-contrib-connect仅在设置keepalive: true时阻止，否则只要grunt正在运行就会运行。由于grunt watch无限期运行，您无需强制grunt-contrib-connect加入“keepalive”

要修复。

keepalive: false //turn off keepalive

移动watch阻止任务以执行最后一次

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

如果你绝对需要同时运行两个阻止任务，你可以使用像grunt-concurrent这样的插件 https://stackoverflow.com/a/42319772/3656963

或者使用2个命令行分别调用每个任务。

同时修正拼写错误：task: ['sass']至tasks: ['sass']

grunt watch不会替换sass文件。请告诉我我在这里做错了什么

1 个答案: