MVC 4 - Script/Css Rendering Problems

Question

I get the following error mesasges in my browser console:

GET http://*:54559/Scripts/ 403 (Forbidden)

http://:54559/Content/css/ 400 (Bad Request)

Uncaught ReferenceError: $ is not defined

In my _Layout.shtml I use the following code to try and include css/bootstrap.

@Styles.Render("~/Content/css/*")

<!-- JavaScript -->
@Scripts.Render("~/Scripts/")
@RenderSection("scripts", required: false)

<script>
    // Activates the Carousel
    $('.carousel').carousel({
        interval: 5000
    })
</script>

The file paths look ok as in my project the css is located at "Content/css" and scripts is just a folder at the top level called "Scripts"

Any ideas?

Follow the link included in Chris' answer. You need to create a bundle and then @Scripts.Render will include those scripts which are added to the bundle. — AbhinavRanjan
– AbhinavRanjan, Commented Dec 29, 2013 at 20:05

Community · Accepted Answer · 2017-05-23 11:46:19Z

~/Content/css/ and ~/Scripts/ aren't file paths. They are bundle names, so if you don't have a Bundle file follow these steps:

In your App_Start folder add a BundleConfig Class:

 public class BundleConfig
 {

 }

Add a RegisterBundles method like this:

public static void RegisterBundles(BundleCollection bundles)
{

}

Then you can add a bundle, write this code into your method:

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

Here ~/Content/css is your Bundle Name and ~/Content/site.css is your Css File Path.Change it if your css file in a different path.

Now there is one more step, open your Global.asax file and add this code into your Application_Start :

BundleConfig.RegisterBundles(BundleTable.Bundles);

Then you can render your Bundle with:

@Styles.Render("~/Content/css")

And also you can render more than one file with one bundle, to do this add your all file paths here like this:

bundles.Add(new StyleBundle("~/Content/css")
.Include("~/Content/site.css",
         "~/Content/sample.css",
         "~/Content/sample2.css"));

PS: Also you can take a look at this question about benefits of using Bundles: Usage of the ASP.NET MVC4 jquery/javascript bundles

Mister Epic · Accepted Answer · 2013-12-29 19:59:40Z

2

MVC is looking for Bundles, which are lists of the scripts and CSS files you want to use in your site.

Check out your bundle registration file at App_Start\BundleConfig.cs

Ensure your bundle names correspond to what you are passing into Scripts and Styles.

http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification

answered Dec 29, 2013 at 19:59

Mister Epic

16.8k13 gold badges88 silver badges156 bronze badges

2 Comments

Lemex Over a year ago

Ahh i dont even have a bundleconfig.cs file

Mister Epic Over a year ago

Now you have an opportunity to learn about bundles, then :) They're all kinds of awesome sauce!

Collectives™ on Stack Overflow

MVC 4 - Script/Css Rendering Problems

2 Answers 2

Comments

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related