이 질문을하기 전에 StackOverflow에 severalsimilarquestionsposted이 있지만 그 중 어느 것도 문제에 대한 정확한 해결책을 제공하지 못함을 지적하고 싶습니다. 그런트 프로덕션 환경에 대한 하나 개의 파일로 결합하고 축소하고 여러 CSS 파일 위치를CSS 및 Grunt 축소의 상대 경로는 무엇입니까?
문제는 내가 워크 플로 설정을 가지고있다.
내가 직면 한 문제는 글꼴과 이미지 경로가 기존의 상대 파일 경로를 가리키고 있기 때문에 Grunt를 실행 한 후에 손상된다는 것입니다. static/homepage/startup/common-files/css/icon-font.css
내
나는 다음과 같은 CSS 규칙이 있습니다 : 내 Gruntfile에서
@font-face{font-family:Flat-UI-Icons;src:url(../fonts/Startup-Icons.eot);
을, 나는 나의 축소 된 CSS 파일의 출력이 style.min.css
는 static/css/custom/homepage/
에 위치하도록 지정 예를 들어
- 복사 모든 종속 파일이 있도록 그들이 상대 위치 : 나는이 문제를 해결하려면 두 가지 옵션이 있다고 생각했습니다이
를 해결하려고했던 어떤
새로운 디렉토리
style.min.css
가 상주합니다. 이 단점은 빠르게 지저분 해져서 프로젝트 폴더 구조를 망칠 수 있다는 것입니다! - 수동으로 경로를 수동으로 변경하십시오. 그러나 다시,이 점은 무엇입니까? Grunt는 작업 자동화를 위해 설계되었습니다!
아무도이 문제를 해결하는 방법을 알고 있습니까? 나는 이것에 거의 10 시간을 낭비하고 나는 포기하는 것을 시작하고있다. 사람들은 Github issue page에서 문제를 해결했다고 주장하지만 아무도 정말로 어떻게 고쳐야한다고 말하지 않습니다.
편집 :
나는 clean-css library 소스 코드를 검토 한 결과 당신은 minifier 객체에 relativeTo
속성을 전달할 수 있다는 것. 나는 이것으로 주변을 어지럽 혔지만, 나는 여전히 붙어있다. 나는 이것에 관해 더 이상 이해하면 다시보고 할 것이다.
편집 :
마침내 relativeTo
(및 기타) 특성이 무엇을 설명하고 몇 가지 문서를 발견했습니다 좋아요. 나는 아직도
relativeTo - path to resolve relative @import rules and URLs
root - path to resolve absolute @import rules and rebase relative URLs
roundingPrecision - rounding precision; defaults to 2; -1 disables rounding
target - path to a folder or an output file to which rebase all URLs
여기 참조를 위해 내 그런트 구성 파일입니다 .... 내 구성이 비록 내 파일 구조해야 정확히 무엇에 붙어있어 : module.exports = function(grunt) {
grunt.initConfig({
concat: {
homepage: {
src: [
'static/homepage/startup/common-files/css/icon-font.css',
'static/homepage/startup/flat-ui/bootstrap/css/bootstrap.css',
'static/homepage/startup/flat-ui/css/flat-ui.css',
'static/homepage/static/css/style.css'
],
dest: 'static/css/custom/homepage/compiled.css',
}
},
cssmin: {
homepage: {
src: 'static/css/custom/homepage/compiled.css',
dest: 'static/css/custom/homepage/style.min.css'
}
}
});
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks("grunt-css-url-rewrite");
grunt.registerTask('build', ['concat', 'cssmin']);
grunt.registerTask('default', ["build"]);
};
감사합니다.
나는 'relativeTo', 'target'및 'root'를 성공하지 않고 놀려고 노력하는 데 많은 시간을 보냈다./ – jitowix
해결책에 가까워지고 있습니다! 나의 코멘트를 여기에서 보아라. (나의 사용자 이름은 jjmpsp이다.) https://github.com/yeoman/grunt-usemin/issues/225 –
Ok 나는 내일 그것을 보려고 노력할 것이다. (나는 이미 고통을 느낍니다 ^^) – jitowix