heihachi88
4/25/2016 - 5:35 PM

Elixir / bower / bootstrap-sass / gulp

Elixir / bower / bootstrap-sass / gulp

<!-- Bootstrap -->
{!! Html::style(asset('css/app.css')) !!}

<!-- Elixir version -->
{!! Html::style(elixir('css/app.css')) !!}
# install bootstrap-sass and save to bower.json
bower install bootstrap-sass --save

# run gulp
gulp

# Run all tasks and minify all CSS and JavaScript...
gulp --production

# Watching Assets For Changes
gulp watch
# elixir looking for resources/assets/sass/app.scss

elixir(function(mix) {
  // sass: rendering app.scss with @import
  mix.sass('app.scss');
  
  // javascript: copying from bower to resources/assets/js, then mixing them up
  mix.copy('resources/assets/bower/jquery/dist/jquery.min.js', 'resources/assets/js/jquery.min.js');
  mix.scripts(['jquery.min.js', 'app.js'], 'public/js/app.js');
  
  // adding version
  mix.version(['css/app.css', 'js/app.js']);
});
/* uncomment this line */

@import "resources/assets/bower/bootstrap-sass/assets/stylesheets/bootstrap";

/* variables */
// copy and import before bootstrap core files
// resources/assets/bower/bootstrap-sass/assets/stylesheets/bootstrap/_variables.scss
{
  "directory": "resources/assets/bower"
}