我正在尝试在 asp.net core 项目中使用 bootstrap。我用 Bower 安装了 bootstrap。
这是我的凉亭文件:
{
"name": "asp.net",
"private": true,
"dependencies": {
"bootstrap": "3.3.7",
"jquery": "2.2.0",
"jquery-validation": "1.16.0",
"jquery-validation-unobtrusive": "3.2.6",
"font-awesome": "4.7.0",
"metisMenu": "~2.2.0",
"slimScroll": "~1.3.7",
"pace": "~1.0.2",
"angular2": "1.6.3"
},
"resolutions": {
"jquery": ">= 1.7.2",
"jquery-validation": "1.16.0"
}
}
我创建了一个 mvc 项目并使用了布局视图。
这是我正在使用的_layout:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - .NET Core 1.0</title>
<!-- Add local styles, mostly for plugins css file -->
@if (IsSectionDefined("Styles"))
{@RenderSection("Styles", required: false)}
<environment names="Development">
@*<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.css" />*@
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="~/lib/font-awesome/css/font-awesome.css" />
<link rel="stylesheet" href="~/lib/metisMenu/dist/metisMenu.css" />
<link rel="stylesheet" href="~/css/animate.css" />
<link rel="stylesheet" href="~/css/style.css" asp-append-version="true" />
</environment>
<environment names="Staging,Production">
<link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/lib/font-awesome/css/font-awesome.min.css" />
<link rel="stylesheet" href="~/lib/metisMenu/dist/metisMenu.min.css" />
<link rel="stylesheet" href="~/css/animate.css" />
<link rel="stylesheet" href="~/css/style.css" asp-append-version="true" />
</environment>
</head>
<body>
<!-- Wrapper-->
<div id="wrapper" class="@Html.PageClass()">
<!-- Main view -->
@RenderBody()
</div>
<!-- End wrapper-->
<environment names="Development">
<script src="~/lib/jquery/dist/jquery.js"></script>
@*<script src="~/lib/bootstrap/dist/js/bootstrap.js"></script>*@
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="~/lib/metisMenu/dist/metisMenu.js"></script>
<script src="~/lib/slimScroll/jquery.slimscroll.js"></script>
<script src="~/lib/pace/pace.js"></script>
<script src="~/js/script.js"></script>
<script src="~/lib/angular/angular.js"></script>
</environment>
<environment names="Staging,Production">
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="~/lib/metisMenu/dist/metisMenu.min.js"></script>
<script src="~/lib/pace/pace.min.js"></script>
<script src="~/lib/slimScroll/jquery.slimscroll.min.js"></script>
<script src="~/js/script.js" asp-append-version="true"></script>
</environment>
@RenderSection("scripts", required: false)
</body>
</html>
我的问题是,当我从链接加载引导程序时,一切正常,但是当我尝试从
本地加载它时
~/lib/bootstrap/dist/css/bootstrap.css 和 js 来自
〜/lib/bootstrap/dist/js/bootstrap.js 没有任何作用。
我看过其他帖子,但没有一个有帮助。有什么建议吗?
这是 Bower 上 Bootstrap 3.3.7 版本的问题。我通过回滚到 3.3.6 解决了这个问题,但您也可能使用 npm 获得成功。