在MVC中创建捆绑包的虚拟路径？

Question

我在我的mvc应用程序中为脚本和样式创建了bundle.

bundles.Add(new ScriptBundle("〜/ bundles/jquery").Include("〜/ Scripts/jquery-1.*"));

bundles.Add(new StyleBundle("〜/ Content/css").Include("〜/ Content/CSS/abc.css"));

在这种情况下,因为存在一个真实的目录~/Content/CSS,所以存在名称冲突问题,因此它找不到css并且无法应用样式.所以我改变了虚拟路径~/Content/styles/css,它的工作原理.所以我在这里有点困惑,虚拟路径如何在这里工作？

Answer 1

使用虚拟路径“~/Content/CSS/someName”会更好，因为“someName”css 将具有与真正的 abc.css 相同的路径。换句话说，捆绑包的虚拟路径不仅是路径，也是路径和文件名（在我的示例中文件名是“someName”）

然后，在浏览器中将 web.configcompilationDebug 设置为 false，您将看到捆绑包的虚拟路径。对于浏览器来说，它是 css 或 js 文件的 url。

为什么真正的 css 和捆绑的路径最好相同？由于 css 中资源的相对路径（img、字体等）。

示例：您有样式 background-image: url(images/1.jpg); 在 Content/CSS/abc.css 中，并为您的包使用虚拟路径 ~/Content/styles/css 。结果你得到 404 图像，因为浏览器将通过 url 请求图像： /Content/styles/images/1.jpg 而不是 /Content/css/images/1.jpg

如果您在同一包中包含具有不同路径的 css，请使用 CssRewriteUrlTransformation。

是的，您的示例中存在名称冲突，因为结果中的虚拟 css 具有与真实文件夹相同的 url。