Why are Scripts and Styles not rendering in ASP.Net Webforms (NOT MVC)

Question

I'm trying unsuccessfully to get script and style bundling working in a .NET framework 4.8 Webforms application with limited success.

I've installed the Microsoft.AspNet.Web.Optimization NuGet package and have built my Bundle Config class according to the documentation, and I call the RegisterRoutes in the Application_Start in global.asax, but when I try to get the bundles to render on the master page, I get errors and the page doesn't load.

in BundlesConfig.cs...

public class BundleConfig
{
    public static void RegisterBundles(BundleCollection bundles)
    {
        bundles.Add(new StyleBundle("~/bundles/SiteCSS").Include(
            "~/Theme/bootstrap/css/bootstrap.css",
            "~/Theme/fontawesome/css/all.css",
            "~/Theme/site/site.css"
            ));

        bundles.Add(new ScriptBundle("~/bundles/SiteJS")
            .Include(
            "~/Theme/jquery/js/jquery-3.6.0.js",
            "~/Theme/bootstrap/js/bootstrap.js",
            "~/Theme/fontawesome/js/all.js",
            "~/Theme/site/site.js"
            ));//.Transforms.Add(new JsMinify());
    }
}

in global.asax...

protected void Application_Start(object sender, EventArgs e)
{
    BundleTable.EnableOptimizations = true;
    RouteConfig.RegisterRoutes(RouteTable.Routes);
    BundleConfig.RegisterBundles(BundleTable.Bundles);
}

But when I come to add the following in the site master page...

<asp:PlaceHolder runat="server">
    <%: Styles.Render("~/bundles/SiteCss") %>
</asp:PlaceHolder>

and

<asp:PlaceHolder runat="server">
    <%: Scripts.Render("~/bundles/SiteJS") %>
</asp:PlaceHolder>

I get the errors...

CS0103: The name 'Styles' does not exist in the current context.

and

CS0103: The name 'Scripts' does not exist in the current context.

It feels like I've done all I need to do as it appears to be fairly straight forward, but its just not working...

Any ideas?

Thanks, Karl

Have you added `` in your web.config under the `namespaces` section? — Rahul Sharma, Apr 05 '22 at 19:47
Hi Rahul, I had not. I just added this and now it half works... It seems the styles part works, but when it gets to the bottom of the page and tries to render the scripts, I get an "Object reference not set to an instance of an object" error? I' checked the name of the bundle and it's the same as when it gets created in BundleConfig — Karl, Apr 06 '22 at 08:09
Change `bundles.Add(new ScriptBundle("~/bundles/SiteJS")` to `bundles.Add(new Bundle("~/bundles/SiteJS")` and try again — Rahul Sharma, Apr 06 '22 at 08:27
That was it. If you can add these as an answer I can upvote. Thanks. — Karl, Apr 06 '22 at 08:43

score 1 · Accepted Answer · answered Apr 06 '22 at 08:49

Regarding your scenario, you firstly need to make sure that you have added: <add namespace="System.Web.Optimization" /> in your web.config under the namespaces section. This will take care of the context errors and your Scripts and Styles will be available to the View.

Secondly, regarding the Object reference not set to an instance of an object error, you need to change ScriptBundle into just Bundle because ScriptBundle invokes a minifier, and if there is any issue in that process (like the script is already minified, some error in minification process etc.) then the ScriptBundle will return null and hence the error is thrown. So to prevent this error and stop the minification step in bundling, just use the Bundle type when adding to your BundleConfig.cs entries.

Change

bundles.Add(new ScriptBundle("~/bundles/SiteJS")

to

bundles.Add(new Bundle("~/bundles/SiteJS")

Why are Scripts and Styles not rendering in ASP.Net Webforms (NOT MVC)

1 Answers1