css - MVC 5 元素中缺少图标

Question

我正在处理一个 MVC 5 元素。我已经整合了SummerNote进入元素。现在，您在上面的链接中看到的工具栏有一些图标。当我运行我的元素时，它在本地运行良好，但当我部署时它找不到图标。因此，由于我不完全理解整个事情是如何工作的，所以我通过更改 summernote-bs3.css 和 summernote.css 中的路径来修复部署，但当然本地版本坏了。

我为部署修复它的方式是我改变了:

@font-face {
font-family: 'Glyphicons Halflings';
src: url('~/Content/fonts/glyphicons-halflings-regular.eot');
src: url('~/Content/fonts/glyphicons-halflings-regular.eot?#iefix')     
format('embedded-opentype'), url('~/Content/fonts/glyphicons-     halflings-    
regular.woff') format('woff'), url('~/Content/fonts/glyphicons-halflings-
regular.ttf') format('truetype'), url  ('~/Content/fonts/glyphicons-
halflings-regular.svg#glyphicons_halflingsregular') format('svg');}

到:

@font-face {
font-family: 'Glyphicons Halflings';
src: url('../Content/plugins/fonts/glyphicons-halflings-regular.eot');
src: url('../Content/pluginsfonts/glyphicons-halflings-regular.eot?#iefix') 
format('embedded-opentype'), url('../Content/plugins/fonts/glyphicons-
halflings-regular.woff') format('woff'), 
url('../Content/plugins/fonts/glyphicons-halflings-regular.ttf') 
format('truetype'), url('~/Content/fonts/glyphicons-halflings-
regular.svg#glyphicons_halflingsregular') format('svg');}

请注意，我将 ~/Content/fonts/ 更改为 ../Content/fonts/。我也为 summernote.css 做了同样的事情。

原因是在我的部署中，我看到有人试图下载:

https://mysite.azurewebsites.com/plugins/~/content/fonts/ .....

但它找不到它，即使 ~ 意味着 home，在这种情况下实际上与 ../相同。

所以我不太确定如何解决这个问题。这些路径是如何工作的，或者它们是从哪里获取的？

感谢您的想法和帮助。

Answer 1

好的，经过数小时的试用，我弄清楚了如何将字体/样式的路径添加到网站的 URL。在 bundle.config 中:

bundles.Add(new StyleBundle("~/plugins/summernoteStyles").Include(

上面以粗体显示的基础被添加到您网站域的末尾。所以我得到:

https://mysite.azurewebsites.net/ 插件/fonts/glyphicons-halflings-regular.woff

为了修复它，我将 bundle.config 更改为如下所示:

bundles.Add(new StyleBundle("~/Content/plugins/summernote/summernoteStyles").Include(

也许有一天它会对其他人有所帮助。