我正在尝试使用react-bootstrap和web pack。我能够在页面上获得引导程序<Button>
,但是没有附加样式?
我安装了:
"devDependencies": {
"babel-core": "^5.1.11",
"babel-loader": "^5.0.0",
"css-loader": "^0.12.1",
"react-hot-loader": "^1.2.2",
"react-router": "^0.13.3",
"webpack": "^1.7.2",
"webpack-dev-server": "^1.7.0"
},
"dependencies": {
"bootstrap": "^3.3.4",
"react": "^0.13.0",
"react-bootstrap": "^0.22.6",
"whatwg-fetch": "^0.8.1"
}
}
webpack.config.js中的加载器
module: {
loaders: [
{ test: /\.jsx?$/, loaders: ['react-hot', 'babel'], include: path.join(__dirname, 'app') },
{ test: /\.css$/, loader: "style-loader!css-loader" },
{ test: /\.png$/, loader: "url-loader?limit=100000" },
{ test: /\.jpg$/, loader: "file-loader" }
]
}
答案 0 :(得分:35)
react-bootstrap不包含引导样式。
他们把它放在Getting Started页面上:
- 因为很多人使用自定义Bootstrap主题,所以我们不直接依赖Bootstrap。您可以自行决定如何获取并链接到Bootstrap CSS和字体。
您应该从bootstrap/css/bootstrap.css
导入样式。既然你已经有了css文件的加载器设置并且依赖于bootstrap,它就像
require('bootstrap/css/bootstrap.css');