여기서 작업 생성에 대한 공식 Grunt 문서를 살펴 보았습니다.
http://gruntjs.com/creating-tasks
하고 싶은 두 가지 작업이 있지만 두 번째 작업은 첫 번째 작업이 완료 될 때까지 실행할 수 없습니다. 두 번째 작업은 첫 번째 작업의 출력을 가져 와서 새 출력을 만드는 데 사용하기 때문입니다.
그것을 분해하려면
내 프로젝트에는 Bootstrap이 포함되어 있으므로 사용하지 않는 코드가 많이 있습니다. 내 첫 번째 목표는 사용하지 않는 코드를 uncss. 그런 다음이 새 CSS 파일에서 출력을 가져 와서 cssmin.
다음은 gruntjs의 정확한 예입니다.
grunt.registerTask('foo', 'My "foo" task.', function() {
// Enqueue "bar" and "baz" tasks, to run after "foo" finishes, in-order.
grunt.task.run('bar', 'baz');
// Or:
grunt.task.run(['bar', 'baz']);
});
나는 이것을 내 코드에 적용하려고했습니다.
grunt.registerTask('default', 'uncss', function() {
grunt.task.run('cssmin');
});
즉 grunt,를 입력하면 기본값은 uncss작업을 먼저 실행하고 완료 될 때까지 기다린 다음 cssmin작업 을 실행하는 것입니다. 그러나 나는이 출력을 얻었습니다.
"기본"작업 실행
"cssmin : css"(cssmin) 작업 실행
1 개의 파일이 생성되었습니다. 3.38kb-> 2.27kb
완료, 오류없이
여기 나의 initConfig
uncss: {
dist: {
files: {
'directory/assets/stylesheets/tidy.css': ['directory/*.html', 'directory/views/*.html']
}
}
},
cssmin: {
css: {
files: {
'directory/assets/stylesheets/styles.min.css': ['directory/assets/stylesheets/styles.css']
}
}
}
즉, 내 폴더에 두 개의 스타일 시트가 있습니다. 하나는 내가 만든 사용자 정의 스타일을 포함하고 다른 하나는 축소 된 부트 스트랩을 포함합니다. 를 실행 uncss하면라는 새 CSS 파일이 생성 tidy.css됩니다.
cssmin 태스크는이 tidy.css 파일을 찾아 축소하여 새 styles.min.css파일을 생성 합니다.
이 작업을 수행 할 수 있지만 하나의 작업을 수동으로 실행 한 다음 다른 작업을 실행해야합니다. 순서대로 실행되도록하려면 어떻게 자동화 할 수 있습니까?
첫째, 모범 사례는 npm 패키지를 사용하여 모든 작업을 자동으로로드하는 것입니다.
// Load grunt tasks automatically
require('load-grunt-tasks')(grunt);
다음은 두 가지 지저분한 작업입니다.
one: {
wake up...
},
two: {
dress up...
},
여기에 순서대로 실행하는 방법이 있습니다.
grunt.registerTask('oneThenOther', [
'one',
'two'
]);
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다