css - 网络服务器显示错误的布局

Question

我最近部署了我的 asp.net mvc 应用程序。

功能按预期工作，但我有设计问题。

我正在使用 Bootstrap

我在网站上有几个页面，有些页面需要更大一点，所以我在两个页面上最多有 20 列，在另一个页面上最多有 12 列。

我使用了两个单独的布局来完成这项工作，其中一个加载包含 12 列的 Bootstrap 文件，另一个布局加载包含 20 列的文件。

捆绑:

12 列(bootstrap.min)

        bundles.Add(new StyleBundle("~/energy/css").Include(
                  "~/Content/bootstrap.min.css",
                  "~/Content/bootstrap-datetimepicker.css",
                  "~/Content/bootstrap-select.css",
                 "~/Content/octicons.css",
                  "~/Content/css/select2.css",
                  "~/Content/Automation.css"));

20 列(自举)

        bundles.Add(new StyleBundle("~/energyTwo/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/bootstrap-datetimepicker.css",
                  "~/Content/bootstrap-select.css",
                 "~/Content/octicons.css",
                  "~/Content/css/select2.css",
                  "~/Content/Automation.css"));

布局1:

@Styles.Render("~/energy/css")

布局2:

@Styles.Render("~/energyTwo/css")

这在本地有效，但由于某种原因在网络服务器上，带有 bootstrap -12 列的文件总是被加载，而不是带有 20 列的文件。我究竟做错了什么？

Answer 1

尝试以不同的方式重命名您的 Bootstrap 文件:

  bundles.Add(new StyleBundle("~/energy/css").Include(
                  "~/Content/bootstrap.css",
                  "~/Content/bootstrap-datetimepicker.css",
                  "~/Content/bootstrap-select.css",
                 "~/Content/octicons.css",
                  "~/Content/css/select2.css",
                  "~/Content/Automation.css"));


bundles.Add(new StyleBundle("~/energyTwo/css").Include(
                  "~/Content/bootstrap.modified.css",
                  "~/Content/bootstrap-datetimepicker.css",
                  "~/Content/bootstrap-select.css",
                 "~/Content/octicons.css",
                  "~/Content/css/select2.css",
                  "~/Content/Automation.css"));

并且始终将完整版本的 css 文件指向包，因为它严重依赖命名约定。

捆绑和缩小将使用您指向的文件进行调试，并生成缩小版本以供发布。例如，energy bundle 将为 Release 配置生成 bootstrap.min.css 并为 bootstrap.css 使用 调试配置。