2015-02-04 2 views
3

그래서 Laravel 5, Elixir 및 Bower로 시작하여 laravel-news에 게시 된 가이드를 따랐습니다.Laravel Elixir : Gulp가 Bootstrap Sass 파일을 컴파일하지 않습니다.

모든 스크립트를 컴파일했지만 Gulp는 Finished 'sass' after 228 ms이라고해도 부트 스트랩 Sass 파일을 컴파일하지 않습니다. 이것은 내가 내 gulpfile의 기압에있는 것입니다 :

var paths = { 
    'bootstrap': './vendor/bower_components/bootstrap-sass-official/assets/' 
} 

elixir(function(mix) { 
    mix.sass("style.scss", 'public/css/', {includePaths: [paths.bootstrap + 'stylesheets/']}) 
}); 

을하지만 꿀꺽를 실행할 때의 CSS 파일에 더 css 디렉토리가 없습니다.
무엇이 문제 일 수 있습니까? 나는 진짜로 무슨 문제인지 모른다.

내가 모든 응용 프로그램을 맥 OSX (10.10), MAMP에서 실행하고 업데이트하고있어, 등 종속
비약이 최신 버전이며이 (*없이 특정 버전)의 경우 내가 확인 this stackoverflow post에 명시된 바와 같이.

엘 릭셔를 디버그 할 수있는 방법이 있습니까? 나는 이것에 관해 아무것도 발견하지 못했다.


솔루션은 내가 문제가 경로라고 생각 this answer

답변

2

솔루션 :
그것은 잘못된 경로 아니었다 하지만 더 나는 그 기능의 문서화를 오해했다. includePaths:은 CSS 파일에 Sass를 포함시키지 않습니다. Sass에게 @import으로 가져온 파일을 찾을 곳을 알려줍니다.

gulpfile.js 나는 CSS 파일을 컴파일 할 수 있었다이 코드

var bower_path = "./vendor/bower_components"; 
var paths = { 
    'jquery'  : bower_path + "/jquery/dist", 
    'bootstrap' : bower_path + "/bootstrap-sass-official/assets", 
    'fontawesome': bower_path + "/fontawesome" 
}; 

mix.sass("app.scss", "public/assets/css", { 
    includePaths: [ 
    paths.bootstrap + '/stylesheets', 
    paths.fontawesome + '/scss' 
    ] 
}); 

자원/자산/말대꾸/app.scss

@import "bootstrap"; 
@import "font-awesome"; 

.

전체 코드는 InvoicePlane repo at Github에서 찾을 수 있습니다.

0

에 게시.

documentation에 따르면 scss 파일은 resources/assets/sass으로 간주됩니다. bower에 대한 Elixir의 기본 설정 경로는 vendor/bower_components입니다. 이는 여러분이 가리키는 것입니다. 변경해야하는 경우 새로운 경로가있는 elixir.json 파일을 프로젝트의 루트에 작성하면됩니다.

{ 
    bowerDir: 'your/new/path' 
} 

부트 스트랩의 scss는 이미 Elixir의 ingredients/sass.js에 포함되어 있습니다.

includePaths: [elixir.config.bowerDir + "/bootstrap-sass-official/assets/stylesheets"] 

또한 sass() 인수에 기본 CSS 출력 경로가 포함되어 있습니다. 사용자 정의하는 SCS 파일이 resources/assets/scss/style.scss하고 vendor/bower_components/bootstrap-sass-official/assets/stylesheets가 유효한 경로 그래서 만약 당신은

elixir(function(mix) { 
    mix.sass("style.scss"); 
}); 

을 필요로한다 그것은 public/css로하는 SCS를 컴파일합니다. 제 경험상 제 장비 설치는 /bower_components입니다. 나는 그 자습서가 .bowerrc 파일을 기반으로 한 Laravel의 베타 릴리스를 생각해 봅니다.이 파일은 bower에게 vendor 디렉토리에 라이브러리를 설치하도록 알려줍니다. 안정적인 설치에서는 .bowerrc 파일이 없습니다. 희망이 도움이!

mix.less("../../../vendor/twbs/bootstrap/less/bootstrap.less"); 

참고 :

0

또 다른 해결책은 말대꾸 또는 공급 업체의 폴더에 앉아 작은 파일을 컴파일 할 때이 줄을 사용하고 난 사용 "작곡가 twbs/부트 스트랩을 필요로"전체 패키지를 얻을 수 있습니다. 웅덩이가 필요 없습니다.

편집 : 자원 폴더에 컴파일 된 CSS 파일이 다른 CSS 파일과 결합 할 수

I 출력 :

mix.less("../../../vendor/twbs/bootstrap/less/bootstrap.less", 'resources/css'); 


mix.styles([ 
    "bootstrap.css" 
], 'public/css/app.css');