以下などbootstrap用loaderもあるっぽいけど、
bootstrapで組んでいくというよりはベースにしてextendしたりしながら使いたいのでちょっと違和感がある。
https://github.com/shakacode/bootstrap-loader
なのでsass-loaderでbootstrap使えるように設定したのだけど若干手順がめんどかったのでメモ
手順
1. package.json
$ npm install --save-dev node-sass bootstrap-sass
$ npm install --save-dev webpack
$ npm install --save-dev css-loader style-loader sass-loader file-loader
2. webpack.config.js
webpack.config.js
module.exports = {
entry: './src/index.js',
output: {
filename: 'bundle.js',
path: 'built'
},
module: {
loaders: [
//bootstrapのフォントまわりのため
{
test: /\.woff2?$|\.ttf$|\.eot$|\.svg$/,
loader: 'file'
},
{
test: /\.scss$/,
loaders: ['style', 'css', 'sass']
}
]
}
}
3. アプリかく
src/index.js
require('./stylesheets/main.scss');
//...
src/stylesheets/main.scss
$icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/";
@import "~bootstrap-sass/assets/stylesheets/_bootstrap.scss";