twitter-bootstrap 如何将 bootstrap 3 添加到基于 Angular2 webpack 的项目中
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/37840333/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add bootstrap 3 to Angular2 webpack based project
提问by Shahzad
I have installed the npm packages for jquery & bootstrap, and then added imports into vendor.ts, but I still don't have any bootstrap styling showing up on the browser.
我已经为 jquery 和 bootstrap 安装了 npm 包，然后将导入添加到了vendor.ts，但我仍然没有在浏览器上显示任何引导样式。
...
import 'jquery/dist/jquery.js'
import 'bootstrap/dist/css/bootstrap.css';
import 'bootstrap/dist/js/bootstrap.js';
...
I have also tried adding another entry within webpack.common.js, but that didn't help either.
我也尝试在 中添加另一个条目webpack.common.js，但这也无济于事。
entry: {
'bootstrap': './node_modules/bootstrap/dist/css/bootstrap.min.css',
'polyfills': './src/polyfills.ts',
'vendor': './src/vendor.ts',
'main': './src/main.browser.ts'
}
Any help would be much appreciated, thanks.
任何帮助将不胜感激，谢谢。
回答by kirqe
You can just use one of the available angular seed projects. For example this one https://github.com/preboot/angular2-webpack
您可以只使用可用的角度种子项目之一。例如这个https://github.com/preboot/angular2-webpack
to install bs, just run npm install jquery bootstrap --save
要安装 bs，只需运行 npm install jquery bootstrap --save
then add the following to vendor.ts
然后将以下内容添加到 vendor.ts
import 'jquery';
import 'bootstrap/dist/js/bootstrap';
import 'bootstrap/dist/css/bootstrap.min.css';
and add the following to wepback.common.js
并将以下内容添加到 wepback.common.js
plugins:[
.....
..... ,
new webpack.ProvidePlugin({
jQuery: 'jquery',
$: 'jquery',
jquery: 'jquery'
})
]
For more details check 4th comment from the following link: https://github.com/AngularClass/angular2-webpack-starter/issues/696
有关更多详细信息，请查看以下链接中的第 4 条评论：https: //github.com/AngularClass/angular2-webpack-starter/issues/696
worked for me. I used to get complains about jquery not found but it solved my problem.
对我来说有效。我曾经抱怨找不到 jquery，但它解决了我的问题。
回答by Trafalgar
I think you need to tell to the Webpack entry point where to find the bootstrap file.
我认为您需要告诉 Webpack 入口点在哪里可以找到引导程序文件。
entry: {
app: './app.ts',
vendor: [
'bootstrap/dist/css/bootstrap.css'
]
}
