Why are @Scripts and @Styles commands not be recognized in MVC4 Razor layout file?

Question

The following MVC4 Razor layout file loads several script and css bundles created in Bundle.config.

<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
  <meta charset="utf-8" />
  <title>XXX Beta</title>
  @Scripts.Render(
  "~/bundles/bundle_jquery",
  "~/bundles/bundle_modernizr",
  "~/bundles/bundle_foundation",
  "~/bundles/bundle_jhs")
  @Styles.Render(
  "~/Content/bundle_foundation",
  "~/Content/bundle_jhs")
  @RenderSection("pageHeadContent", false)
</head>
<body>
  <div id="bodyContainer">
    @Html.Partial("Partial/_header")
    <div id="contentContainer">
      <div id="mainContentContainer">
        <div id="sidebarContainer">
          @RenderSection("sidebarContent", required: true)
        </div>
        @RenderBody()
      </div>
      <div class="clearBoth">
      </div>
    </div>
    @Html.Partial("Partial/_footer")
  </div>
</body>
</html>

When the page is rendered the following error occurs. For some reason the @Scripts and @Styles commands are not being recognized. If I type in "@Scripts" in the files the Intellisense does not display/show the command. The project does reference System.Web.Optimization, which is used in the Bundle.config.

What could be causing the @Scripts and @Styles commands not to be recognized?

Server Error in '/' Application.

Compilation Error

Description: An error occurred during the compilation of a resource required to service this request. Please review the following specific error details and modify your source code appropriately.

Compiler Error Message: CS0103: The name 'Scripts' does not exist in the current context

Source Error:

Line 4: Line 5: XXX Beta Line 6: @Scripts.Render( Line 7: "~/bundles/bundle_jquery", Line 8: "~/bundles/bundle_modernizr",

Source File: c:\Users\username\Documents\Visual Studio 2010\Projects\XXX\Solution\xxx.website\Views\Shared_sidebarLayout.cshtml Line: 6

Show Detailed Compiler Output:

Show Complete Compilation Source:

Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.272

score 126 · Accepted Answer · answered Feb 02 '13 at 19:19

126

Make sure that the System.Web.Optimization.dll assembly has been referenced in your project and that the <add namespace="System.Web.Optimization"/> namespace has been added to your ~/Views/web.config file (not ~/web.config file):

<system.web.webPages.razor>
    <host factoryType="System.Web.Mvc.MvcWebRazorHostFactory, System.Web.Mvc, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />
    <pages pageBaseType="System.Web.Mvc.WebViewPage">
      <namespaces>
        <add namespace="System.Web.Mvc" />
        <add namespace="System.Web.Mvc.Ajax" />
        <add namespace="System.Web.Mvc.Html" />
        <add namespace="System.Web.Optimization"/>
        <add namespace="System.Web.Routing" />
      </namespaces>
    </pages>
</system.web.webPages.razor>

The System.Web.Optimization.dll assembly is contained within the Microsoft.AspNet.Web.Optimization NuGet, so make sure that it is installed in your project (when you create a new ASP.NET MVC 4 project in Visual Studio using the Internet Template this NuGet is automatically added to the project).

answered Feb 02 '13 at 19:19

Darin Dimitrov

1,023,142
271
3,287
2,928

45

For those of you using VS 2013 RC, I had the same error even though I did what Darin suggested. What worked for me was restarting visual studio after doing the marked answer on here. – J86 Sep 27 '13 at 15:37
4

In VS 2015, you have to close any editor windows that were open when you added the namespace in order for them to pick it up. (They must compute namespaces for the window on file open) – npjohns Mar 15 '16 at 20:17
I added the namespaces all correctly, didn't show up, good job I read the comments here! :) – jimplode Jan 30 '17 at 19:19
2

If you are using VS 2017, remember to first add the config entry AND rebuilding, and then restart Visual Studio. Worked for me – EternalWulf Jun 02 '17 at 09:53

score 4 · Answer 2 · answered Jan 13 '15 at 18:15

If you are using bundles (as in the example in question) you may also need to add bundle configuration to your app:

Add Bundle Config to your App_Start folder:

public class BundleConfig
{
    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.js",
            "~/Scripts/jquery.validate.unobtrusive.js"
            ));

        bundles.Add(new StyleBundle("~/Content/css").Include(
            "~/Content/YourStyles.css"));

#if DEBUG

        BundleTable.EnableOptimizations = false;
#else
        BundleTable.EnableOptimizations = true;
#endif
    }
}

Add the following line to your Global.asax.cs

BundleConfig.RegisterBundles(BundleTable.Bundles);

score 3 · Answer 3 · answered Jan 24 '16 at 16:18

3

There are two webconfig files in your project ... both of them need to have

<add namespace="System.Web.Optimization"/>

answered Jan 24 '16 at 16:18

Andrew

31
1

2

or try this : In your view.cshtml include the Optimization namespace and render the bundle(s): @using System.Web.Optimization @Scripts.Render("~/Scripts/jquery") @Scripts.Render("~/Scripts/knockout") – PinoyDev Apr 20 '16 at 14:04

score 3 · Answer 4 · edited May 23 '17 at 12:03

3

As stated here:

open the folder: Users\(user)\AppData\Local\Microsoft\VisualStudio (version)
delete the folder: ComponentModelCache
restart Visual Studio (ComponentModelCache is re-created and the problem goes away)

edited May 23 '17 at 12:03

Community

1
1

answered May 11 '16 at 15:51

DeveloperDan

4,626
9
40
65

score 2 · Answer 5 · answered Dec 23 '15 at 04:53

2

In my case I had to change my project's target framework from 4.5 to 4.5.1.

answered Dec 23 '15 at 04:53

Bat_Programmer

6,717
10
56
67

score 1 · Answer 6 · edited May 23 '17 at 12:03

1

I found the answer here enter link description here

apparently you need to add the web.optimization from your root web.config.

edited May 23 '17 at 12:03

Community

1
1

answered Apr 20 '16 at 13:57

PinoyDev

949
1
10
21

score 1 · Answer 7 · answered Jan 10 '19 at 03:30

1. Make sure System.Web.Optimization dll is rederenced within project's References. if not, install it with NuGet (Package Manager Console):

Install-Package Microsoft.AspNet.Web.Optimization

2. Add the System.Web.Optimization namespace to the "Views" web.config:

<system.web.webPages.razor>   
    <pages pageBaseType="System.Web.Mvc.WebViewPage">
      <namespaces>        
        <add namespace="System.Web.Optimization"/>       
      </namespaces>
    </pages>
</system.web.webPages.razor>

3. If issue still persists, try closing / re-openning Visual Studio to refresh cache.

Why are @Scripts and @Styles commands not be recognized in MVC4 Razor layout file?

Version Information: Microsoft .NET Framework Version:4.0.30319; ASP.NET Version:4.0.30319.272

7 Answers7