我正在构建一个用打字稿编写的angular 2应用程序。它会结合使用bootstrap 4框架和一些自定义主题,这可能吗?
“ ng2-bootstrap” npm软件包不起作用,因为它不允许我使用bootstrap css类,而是提供了自定义组件。(http://github.com/valor-software/ng2-bootstrap)
在我使用sass的angular 2项目中,是否可以从源代码构建bootstrap 4,因为它也使用sass进行样式设置?
Angular2 CLI的Bootstrap4 alpha(也适用于Angular4 CLI)
如果您使用angular2 cli / angular 4 cli,请执行以下操作:
npm i bootstrap@next --save
这会将引导程序4添加到您的项目中。
接下来转到您的src/style.scss
或src/style.css
文件并在其中导入引导程序:
对于style.css
/* You can add global styles to this file, and also import other style files */
@import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
对于style.scss
/* You can add global styles to this file, and also import other style files */
@import "../node_modules/bootstrap/scss/bootstrap";
如果您使用的是scss,请确保在以下位置将默认样式更改为scss .angular-cli.json
:
"defaults": {
"styleExt": "scss",
"component": {}
}
Bootstrap JS组件
自举JS组件来工作,你仍然需要进口bootstrap.js
到.angular-cli.json
下scripts
(这应该自动发生):
...
"scripts": ["../node_modules/jquery/dist/jquery.js",
"../node_modules/tether/dist/js/tether.js",
"../node_modules/bootstrap/dist/js/bootstrap.js"],
...
2017年 9月13日更新:Boostrap 4 Beta现在使用popper.js而不是tether.js。因此,根据您使用的版本,在脚本中导入tether.js(alpha)或popper.js(beta)。感谢您的注意@MinorThreat
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句