Development Tip

두 개의 지저분한 감시 작업을 동시에 실행하는 방법

yourdevel 2020. 12. 11. 20:21
반응형

두 개의 지저분한 감시 작업을 동시에 실행하는 방법


두 개의 감시 작업을 동시에 실행할 수 있습니까?

시계 설정 내에서 원하는 작업을 얼마 든지 가질 수 있다는 것을 이해 하고 단지 grunt watch를 시작 하면 다음과 같이 모든 작업을 볼 수 있습니다.

...
watch: {
    A: {
        files: "js/dev/**/*.coffee",
        tasks: ["coffee", "requirejs"]
    },
    B: {
        files: "js/dev/**/*.coffee",
        tasks: ["coffee"]
    },
    C: {
        files: "js/dev/**/*.html",
        tasks: ["copy"]
    }
}
...

...하지만 이건 필요 없어요. 개발과 생산을 위해 다른 작업 세트를 갖고 싶습니다. 짐작할 수 있듯이 A (생산)와 B (개발) 의 유일한 차이점 은 축소와 연결입니다. AB 작업을 동시에 시작할 필요가 없습니다 .

먼저이 아이디어를 가지고 왔어요

grunt.registerTask("prod", ["watch:A", "watch:C"]);
grunt.registerTask("dev", ["watch:B", "watch:C"]);

그러나 이것은 작동하지 않았습니다. 첫 번째 감시 작업 만 작동합니다 ( C 는 작동하지 않음). 내가 원하는 것을 할 수 있습니까?


나는 grunt 동시 작업을 사용하여 발견했습니다 .

concurrent: {
  options: {
    logConcurrentOutput: true
  },
  prod: {
    tasks: ["watch:A", "watch:C"]
  },
  dev: {
    tasks: ["watch:B", "watch:C"]
  }
}

그때:

grunt.registerTask("prod", ["concurrent:prod"]);
grunt.registerTask("dev", ["concurrent:dev"]);

편집 : 동시성 이제 logConcurrentOutput옵션이 있습니다! 자세한 정보 : https://github.com/sindresorhus/grunt-concurrent#logconcurrentoutput .

Watch는 이상하게 동시에 진행되지만 차단 작업이므로 멀티 태스킹과 같은 기능이 작동하도록하려면 창의적이어야합니다.

Concurrent는 시계 작업에서 모든 출력을 잃게되는데 이는 이상적이지 않습니다.

사용자 지정 작업에서 구성 개체를 동적으로 작성해보십시오.

grunt.registerTask('watch:test', function() {
  // Configuration for watch:test tasks.
  var config = {
    options: {
      interrupt: true
    },
    unit: {
      files: [
        'test/unit/**/*.spec.coffee'
      ],
      tasks: ['karma:unit']
    },
    integration: {
      files: [
        'test/integration/**/*.rb',
        '.tmp/scripts/**/*.js'
      ],
      tasks: ['exec:rspec']
    }
  };

  grunt.config('watch', config);
  grunt.task.run('watch');
});

가장 좋고 유일한 솔루션은 다음과 같습니다. https://npmjs.org/package/grunt-focus 이 플러그인을 추가하고 다음을 수행합니다.

focus: {
            sources: {
                include: ['js', 'html', 'css', 'grunt']
            },
            testu: {
                include: ['js', 'html', 'css', 'testu', 'grunt']
            },
            testi: {
                include: ['js', 'html', 'css', 'testu', 'testi', 'grunt']
            }
        },
        watch: {
            js: {
                files: paths.js,
                tasks: ['jshint'],
                options: {
                    livereload: true
                }
            },
            html: {
                files: paths.html,
                options: {
                    livereload: true
                }
            },
            css: {
                files: paths.css,
                tasks: ['csslint'],
                options: {
                    livereload: true
                }
            },
            testu: {
                files: ['test/**/*.js', 'test/**/*.css'],
                tasks: ['mochaTest'],
                options: {}
            },
            testi: {
                files: ['test/**/*.js', 'test/**/*.css'],
                tasks: ['exec:cleanTestDB', 'protractor_webdriver', 'protractor'],
                options: {}
            },
            grunt: {
                files: ['Gruntfile.js', 'server/config/env/*.js'],
                options: {
                    reload: true
                }
            }
        }

그런 다음 focus : sources 또는 focus : testu를 편의로 사용합니다.

JM.


grunt-concurrent 또는 grunt-focus는 모두 좋은 솔루션이지만 둘 다 livereload기능을 손상 시킵니다.

이에 대한 나의 해결책은 동시에 두 구성을 실행하지 않을 것이라는 가정하에 시계 구성을 동적으로 구성하는 것입니다.

다음과 같이 할 수 있습니다.

grunt.config.merge({
  watch: {
    options: {
      livereload: true
    },
    C: {
      files: "js/dev/**/*.html",
      tasks: ["copy"]
    }
  }
});

grunt.registerTask('watch-forProd', function () {
  grunt.config.merge({
    watch: {
      A: {
        files: "js/dev/**/*.coffee",
        tasks: ["coffee", "requirejs"]
      }
    }
  });

  grunt.task.run('watch');
});

grunt.registerTask('watch-forDev', function () {
  grunt.config.merge({
    watch: {
      B: {
        files: "js/dev/**/*.coffee",
        tasks: ["coffee"]
      }
    }
  });

  grunt.task.run('watch');
});

grunt.registerTask("prod", ["watch-forProd"]);
grunt.registerTask("dev", ["watch-forDev"]);


2018 년 9 월

더 이상 grunt-concurrent를 사용할 필요가 없습니다. grunt에는 이제이 기능이 내장되어 있습니다. 여기에 현재 프로젝트 중 하나의 샘플이 있습니다.

module.exports = function(grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        sass: {
            theme: {
                files: {
                    '../../web/sites/all/themes/ifafri/css/generated/theme_ifafri_master.css' : '../../web/sites/all/themes/ifafri/css/master.scss'
                }
            },
            bootstrap: {
                files: {
                    '../../web/sites/all/themes/ifafri/css/generated/theme_ifafri_bootstrap.css' : '../../web/sites/all/themes/ifafri/css/bootstrap/master.scss' 
                }
            }
        },
        watch: {
            theme: {
                files: '../../web/sites/all/themes/ifafri/css/*.scss',
                tasks: ['sass:theme'],
                options: {
                    spawn: false,
                    livereload: true,
                    nospawn: false
                }
            },
            bootstrap: {
                files: '../../web/sites/all/themes/ifafri/css/bootstrap/*.scss',
                tasks: ['sass:bootstrap'],
                options: {
                    spawn: false,
                    livereload: true,
                    nospawn: false
                }
            }
    }
    });
    grunt.loadNpmTasks('grunt-contrib-sass');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-livereload');
    grunt.registerTask('default',['watch']);
}

Gruntfile.js의 grunt.registerTask () 걱정없이 명령 줄에 다음을 입력하여 grunt를 백그라운드 프로세스로 실행하는 경우가 있습니다.

$ grunt watch:A &
$ grunt watch:C &

보다 편리하게 명령을 배치 스크립트로 만들 수 있습니다. 도움이 되었기를 바랍니다.


나는 이것이 질문에 대한 직접적인 대답이 아니라는 것을 알고 있지만 이제 내 해결책은 Grunt 대신 Gulp를 사용하는 것입니다. Gulp를 사용하면 코드를 작성하고 구성 할 수 없습니다. 따라서 원하는 것을 더 자유롭게 할 수 있습니다.

JM.


나에게 잘 맞는 동시 작업

concurrent: {
            options: {
                logConcurrentOutput: true
            },
            set1: ['watch:html', 'watch:styles'],
        },

grunt.registerTask('default', 'watch');
grunt.registerTask('htmlcss', ['concurrent:set1']);

Just change the port address and the livereload port. For eg. if the port is 9000 change it to 8000 and live reload from 35729 to 36729

참고URL : https://stackoverflow.com/questions/17585385/how-to-run-two-grunt-watch-tasks-simultaneously

반응형