MVC 捆綁 - 無法載入資源
這可能是什麼原因造成的?我正在使用在本地建構和執行的 DurandalJS 項目。當我嘗試部署到 Azure 網站時,應用程序發布但在瀏覽器中失敗:
載入資源失敗:伺服器響應狀態為 404(未找到) http://appsite.azurewebsites.net/Scripts/vendor.js?v=KJCisWMhJYMzhLi_jWQXizLj9vHeNGfm_1c-uTOfBOM1
我沒有定制任何捆綁。
我的捆綁配置:
public class BundleConfig { // For more information on Bundling, visit http://go.microsoft.com/fwlink/?LinkId=254725 public static void RegisterBundles(BundleCollection bundles) { bundles.Add(new ScriptBundle("~/bundles/jquery").Include( "~/Scripts/jquery-{version}.js")); bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include( "~/Scripts/jquery-ui-{version}.js")); bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include( "~/Scripts/jquery.unobtrusive*", "~/Scripts/jquery.validate*")); // Use the development version of Modernizr to develop with and learn from. Then, when you're // ready for production, use the build tool at http://modernizr.com to pick only the tests you need. bundles.Add(new ScriptBundle("~/bundles/modernizr").Include( "~/Scripts/modernizr-*")); bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css")); bundles.Add(new StyleBundle("~/Content/themes/base/css").Include( "~/Content/themes/base/jquery.ui.core.css", "~/Content/themes/base/jquery.ui.resizable.css", "~/Content/themes/base/jquery.ui.selectable.css", "~/Content/themes/base/jquery.ui.accordion.css", "~/Content/themes/base/jquery.ui.autocomplete.css", "~/Content/themes/base/jquery.ui.button.css", "~/Content/themes/base/jquery.ui.dialog.css", "~/Content/themes/base/jquery.ui.slider.css", "~/Content/themes/base/jquery.ui.tabs.css", "~/Content/themes/base/jquery.ui.datepicker.css", "~/Content/themes/base/jquery.ui.progressbar.css", "~/Content/themes/base/jquery.ui.theme.css")); } }DurandalBundleConfig:
public class DurandalBundleConfig { public static void RegisterBundles(BundleCollection bundles) { bundles.IgnoreList.Clear(); AddDefaultIgnorePatterns(bundles.IgnoreList); bundles.Add( new ScriptBundle("~/Scripts/vendor.js") .Include("~/Scripts/jquery-{version}.js") .Include("~/Scripts/jquery-ui-{version}.js") .Include("~/Scripts/bootstrap.js") .Include("~/Scripts/knockout-{version}.js") .Include("~/Scripts/knockout.mapping-latest.js") .Include("~/Scripts/isotope.js") .Include("~/Scripts/toastr.js") .Include("~/Scripts/tag-it.js") ); bundles.Add( new StyleBundle("~/Content/css") .Include("~/Content/ie10mobile.css") .Include("~/Content/app.css") .Include("~/Content/bootstrap.min.css") .Include("~/Content/bootstrap-responsive.min.css") .Include("~/Content/font-awesome.min.css") .Include("~/Content/durandal.css") .Include("~/Content/starterkit.css") .Include("~/Content/toastr.css") .Include("~/Content/tag-it.css") .Include("~/Content/zen-theme.css") ); } public static void AddDefaultIgnorePatterns(IgnoreList ignoreList) { if(ignoreList == null) { throw new ArgumentNullException("ignoreList"); } ignoreList.Ignore("*.intellisense.js"); ignoreList.Ignore("*-vsdoc.js"); ignoreList.Ignore("*.debug.js", OptimizationMode.WhenEnabled); //ignoreList.Ignore("*.min.js", OptimizationMode.WhenDisabled); //ignoreList.Ignore("*.min.css", OptimizationMode.WhenDisabled); } }在我的 html 頁面中,我使用這個:
@Scripts.Render("~/Scripts/vendor.js")這會阻止載入所需的庫(如淘汰賽)。可能是我的 web.comfig 中的某些內容嗎?任何提示都會很棒。
更新:
如果我執行以下操作,我可以在本地重現確切的問題:
new ScriptBundle("~/Scripts/vvendor.js") // change the virtual output directory here我認為這意味著視圖由於某種原因在發佈時找不到目錄…
去掉 ScriptBundle 名稱上的“.js”部分。出於某種原因,這會導致一系列問題。應該是這樣的:
... new ScriptBundle("~/Scripts/vendor") ...然後將其添加到您的頁面,如下所示:
@Scripts.Render("~/Scripts/vendor")
- 不要在包名中使用文件副檔名
正如Brett提到的,你的包名中不應該有文件副檔名。
這樣做的原因是,如果存在副檔名,IIS 路由將假定請求是針對文件的。
- 不要使用文件夾路徑作為包名
注意:這不會在開發中發生,因此可能只會在您部署到生產時才會咬你
要避免的第二件事是捆綁名稱與您的項目/網站中的真實文件夾的名稱相匹配。IIS 將在使用捆綁路由之前匹配物理文件夾。
例如,如果您有一個
/Content/Login用於登錄頁面樣式的文件夾,則不能使用名為~/Content/Login. IIS 將看到物理文件夾並假定它是一個目錄瀏覽請求(您可能會從 Azure 伺服器收到 403 錯誤)。建議命名:
建議您
bundle在所有捆綁包中使用該名稱,以避免目錄衝突,並包括在內css。在您的項目中永遠不要有一個名為 bundles 的文件夾(因為上面的問題 2)。捆綁包名稱範例:
- “〜/捆綁/ jquery”
- “〜/捆綁/外掛”
- “~/捆綁包/css”
- “~/bundles/css/登錄”
- “~/bundles/css/bootstrap”
等等