Laravel Elixir: Gulp не будет компилировать файлы Bootstrap Sass

Question

Итак, я начал с Laravel 5, Elixir и Bower и последовал за гидом, опубликованным на laravel-news.

Мне удалось скомпилировать все сценарии, но Gulp не будет компилировать файлы Bootstrap Sass, даже если он говорит Finished 'sass' after 228 ms. Это то, что у меня в 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 в нем.
В чем проблема? Я действительно не знаю, в чем проблема.

Я бегу на Mac OSX (10,10), MAMP и обновлены все приложения, зависимости и т.д.
Как указано в this stackoverflow post я проверил, если Elixir последняя версия, и это (* и никакой конкретной версии).

Есть ли способ отладить эликсир? Я ничего не нашел об этом.

---

Решение размещены в this answer

Answer 1

Решение:
Он не был неправильный путь, но более что я неправильно понял документацию о функции. includePaths: не сообщает Sass о включении их в файл CSS. Он сообщает Sass, где искать файлы, которые были импортированы с помощью @import.

gulpfile.js

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"; 

С помощью этого кода я был в состоянии скомпилировать файл CSS.

Полный код можно найти на странице InvoicePlane repo at Github.

Answer 2

Я думаю, что проблема ваш путь.

Согласно documentation, ваш файл scss предполагается находиться в resources/assets/sass. Исходный конфигурационный файл Elixir для bower - vendor/bower_components, и это то, что вы, похоже, пытаетесь указать на это. Если вам нужно изменить его, просто создайте файл elixir.json в корне проекта с новой дорожкой для бесед.

{ 
    bowerDir: 'your/new/path' 
} 

Bootstrap в СКС уже включена в Elixir-х ingredients/sass.js.

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

Кроме того, вы в том числе выходной путь к CSS по умолчанию в вашем sass() аргумента. Так что, если ваш пользовательский файл является resources/assets/scss/style.scss СКС и vendor/bower_components/bootstrap-sass-official/assets/stylesheets это правильный путь, вы должны просто нужно

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

и он будет компилировать SCSS в public/css. По моему опыту, установка моей беседки прошла в /bower_components. Я думаю, что бета-релиз Laravel, на котором основаны эти учебные пособия, содержит файл .bowerrc, в котором говорится, что bower устанавливает библиотеки в каталоге vendor. В стабильной установке у меня нет файла .bowerrc. Надеюсь это поможет!

Answer 3

Другого решения является использование этой линии для компиляции дерзости или меньше файлов, сидя в папке поставщика:

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

Примечания: Я использовал «композитор требует twbs/boostrap», чтобы получить полный пакет. Нет необходимости в беседке.

Edit:

I выход скомпилированный CSS файл в папке ресурсов, чтобы объединить его с другими файлами CSS:

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


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