[英]Failing to load twitter Bootstrap resource when using angular-cli
I have used Angular CLI to build my first Angular2 application. 我已经使用Angular CLI构建了我的第一个Angular2应用程序。 I'm trying to make use of the twitter Bootstrap modules but it's failing to find it: 我正在尝试使用twitter Bootstrap模块,但找不到它:
Failed to load resource: the server responded with a status of 404 (Not Found)
http://localhost:4200/node_modules/bootstrap/dist/css/bootstrap.css
I have an index.html with the following line in the 我有一个index.html,其中的以下行
<link href="site.css" rel="stylesheet">
I also then have the single line in the ./public/site.css: 然后,我在./public/site.css中也有一行:
@import 'node_modules/bootstrap/dist/css/bootstrap.css';
The Bootstrap module exists here ./node_modules/bootstrap/dist/css/.. but it still can't find it. Bootstrap模块位于../ node_modules / bootstrap / dist / css / ..,但仍然找不到。 Any thoughts as to what I'm doing wrong? 关于我在做什么错有什么想法吗?
In angular-cli-builds.js
, you need to add the file so it's copied during build. 在angular-cli-builds.js
,您需要添加文件,以便在构建过程中将其复制。
vendorNpmFiles: [
...
'bootstrap/dist/css/bootstrap.css'
]
It will then be available in browser in vendor folder, so change site.css
to 然后它将在供应商文件夹的浏览器中可用,因此将site.css
更改为
@import 'vendor/bootstrap/dist/css/bootstrap.css';
If it doesn't work, after build, check your dist/
folder manually, locate the file and update the paths... 如果不起作用,请在构建后手动检查dist/
文件夹,找到文件并更新路径...
More info here: 3rd party lib installation 更多信息在这里: 3rd party lib安装
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.