0

My problem is that after I have uploaded my website to an online server, the html pages display completely fine except for the images, CSS and JavaScript. I know exactly why this is happening and it is related to Ogglas answer in this stackoverflow question: CSS, Images, JS not loading in IIS

Baisically, I can see that in Google debugger this displays:

<link href="/Content/css?v=oJetwWdJWV96VzkmdyDS6ZG-GSKbNSyRhMkB7__C1dQ1" rel="stylesheet">

<script src="/bundles/modernizr?v=wBEWDufH_8Md-Pbioxomt90vm6tJN2Pyy9u9zHtWsPo1"></script>

However there should be a ~ before /Content and /bundles so the link should be 

<link href="~/Content/css?v=oJetwWdJWV96VzkmdyDS6ZG-GSKbNSyRhMkB7__C1dQ1" rel="stylesheet">

and 

<script src="~/bundles/modernizr?v=wBEWDufH_8Md-Pbioxomt90vm6tJN2Pyy9u9zHtWsPo1"></script>

As the ~ symbol indicates the Root directory of the application.

Problem is that I do not know how to correct this problem in my ASP.NET MVC 5 application.

My bundleConfig.cs file already looks like this:

 public static void RegisterBundles(BundleCollection bundles)
    {


        bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                    "~/Scripts/jquery-{version}.js"));

        bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                    "~/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 https://modernizr.com to pick only the tests you need.
        bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                    "~/Scripts/modernizr-*"));

        bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                  "~/Scripts/bootstrap.js",
                  "~/Scripts/toastr.js",
                  "~/Scripts/respond.js"));

        bundles.Add(new StyleBundle("~/Content/css").Include(
                  "~/Content/bootstrap.css",
                   "~/Content/toastr.css",
                  "~/Content/site.css"));
    }
}

So I don't understand where I am supposed to make this modification so that after deploying my website, my style links include the ~ symbol .

dllhell
  • 1,987
  • 3
  • 34
  • 51
k1r4n
  • 69
  • 2
  • 12

1 Answers1

1

Try this in your bundle config

 BundleTable.EnableOptimizations = false;
Thisara Subath
  • 635
  • 6
  • 16
  • Thank you so much this worked perfectly. I did some more research and found that if I add this line of code to my bundleconfig file then I must put: `@Scripts.Render("~/bundles/jquery") @Scripts.Render("~/bundles/bootstrap") @Styles.Render("~/Content/css")` on every View. So now all my styles are working fine. However, my images are not displaying. The paths look completely fine so I don't know why this could be? – k1r4n Jul 13 '18 at 21:36
  • Its ok I worked it out...I realized I didn't even have the images actually in the folder !! lol – k1r4n Jul 14 '18 at 15:56