Browserify By Grunt.js 시계

Question

저는 Grunt.js에 새입니다. 지금까지

, 나는 모든 파일 변경 - 저장에

browserify ./js/app.js -o ./js/app.bundle.js

을 실행하고있다.

이제 Grunt (0.4.2) 시계로이 프로세스를 자동화하려고합니다.

올바른 방법은 무엇입니까? 감사.

Answer 1

나는 소스 파일이 바뀔 때 grunt-browserify을 통해 browserify 빌드를 실행하는 grunt-contrib-watch으로 감시 작업을 설정하려고합니다.

행동에 넣어, 여기 샘플 Gruntfile.js입니다 : 이제

module.exports = function(grunt) { 
    grunt.initConfig({ 
    pkg: grunt.file.readJSON('package.json'), 
    watch: { 
     files: ['app/app.js'], 
     tasks: ['browserify'] 
    }, 
    browserify: { 
     dist: { 
     files: { 
      'app/app.bundle.js': ['app/app.js'], 
     } 
     } 
    } 
    }); 

    grunt.loadNpmTasks('grunt-contrib-watch'); 
    grunt.loadNpmTasks('grunt-browserify'); 
}; 

그냥 호출하여 변경을 감시하는 데 사용할 수 있습니다 : 당신이 필요

grunt watch 

주 grunt-contrib-watch 및 grunt-browserify과 함께 꿀꺽 꿀꺽 마시십시오.

---

또는 Grunt 대신 Grunt를 사용할 수도 있습니다. gulp-browserify과 함께 gulp-watch을 사용하면 유사한 결과를 얻을 수 있으며 자세한 빌드 파일은 적고 성능은 약간 향상 될 수 있습니다.

Answer 2

어쩌면 늦었지만 grunt-browserify을 통해 브라우저 릿을 사용하고 있습니다. 그것은 매우 편리 옵션이 watch: true browserify 대신 watchify를 사용하고 주로 작업 속도를 높입니다. 내가 전에 NPM과 watchify 설치해야했습니다 물론

browserify: { 
    dev: { 
    src: ['./lib/app.js'], 
    dest: 'build/bundle.<%= pkg.name %>.js', 
    options: { 
     transform: ['reactify'], 
     watch: true 
    } 
    } 
} 

grunt.loadNpmTasks('grunt-browserify'); 
grunt.registerTask('dev', ['browserify:dev']); 

: 같은

내 Gruntfile.js 보인다.