bootstrap package for webpack
Bootstrap use some fonts. You need to configure the correct loaders in your webpack.config.js
. Example:
module.exports = {
module: {
loaders: [
// the url-loader uses DataUrls.
// the file-loader emits files.
{ test: /\.woff$/, loader: "url-loader?limit=10000&minetype=application/font-woff" },
{ test: /\.ttf$/, loader: "file-loader" },
{ test: /\.eot$/, loader: "file-loader" },
{ test: /\.svg$/, loader: "file-loader" }
]
}
};
To use the complete bootstrap package including styles and scripts with the default settings:
require("bootstrap-webpack");
You can configurate bootstrap-webpack with two configuration files:
bootstrap.config.js
bootstrap.config.less
Add both files next to each other to your project. And:
require("bootstrap-webpack!./bootstrap.config.js");
Or simple add it as entry point to your webpack.config.js
:
module.exports = {
entry: [
"bootstrap-webpack!./bootstrap.config.js",
"your-existing-entry-point"
]
};
Example:
module.exports = {
scripts: {
// add every bootstrap script you need
'transition': true
},
styles: {
// add every bootstrap style you need
"mixins": true,
"normalize": true,
"print": true,
"scaffolding": true,
"type": true,
}
};
Write less code. I. e. overwrite the default colors or sizes.
Example:
@font-size-base: 24px;
@btn-default-color: #444;
@btn-default-bg: #eee;