Laravel ElixirでBootstrapを使う時の設定

app.scss

// resources/assets/sass/app.scss

@charset 'UTF-8';

// Bootstrap
@import 'bootstrap/variables';
@import 'node_modules/bootstrap-sass/assets/stylesheets/bootstrap';

// Font Awesome
@import 'font-awesome/variables';
@import 'node_modules/font-awesome/scss/font-awesome';

bootstrap-variables.scss

// resources/assets/sass/bootstrap/_variables.scss

@charset 'UTF-8';

// Load fonts from this directory.
$icon-font-path: '/vendor/bootstrap/fonts/';

font-awesome-variables.scss

// resources/assets/sass/font-awesome/_variables.scss

@charset 'UTF-8';

// Load fonts from this directory.
$fa-font-path: '/vendor/font-awesome/fonts';

gulpfile.js

'use strict';

const elixir = require('laravel-elixir');

elixir((mix) => {
  mix.sass('app.scss')
    .browserify('main.js')
    .copy(
      'node_modules/bootstrap-sass/assets/fonts/bootstrap',
      'public/vendor/bootstrap/fonts'
    )
    .copy(
      'node_modules/font-awesome/fonts',
      'public/vendor/font-awesome/fonts'
    );
});

main.js

// resources/assets/js/main.js

'use strict';

const $ = require('jquery');

window.jQuery = $;
window.$      = $;

require('bootstrap-sass');

package.json

{
  "private": true,
  "devDependencies": {
    "gulp": "^3.8.8"
  },
  "dependencies": {
    "bootstrap-sass": "^3.3.5",
    "font-awesome": "^4.4.0",
    "jquery": "^1.11.3",
    "laravel-elixir": "^3.3.3"
  },
  "engines": {
    "node": ">=4.1.0"
  }
}