0

I wonder why bundling doesn't work. Here is my scenario. I use foundation framework for my front-end. Now, I include foundation.js, foundation.magellan.js. It works fine if I declare it like this.

<script src="~/Scripts/foundation.js"></script> <script src="~/Scripts/foundation.magellan.js"></script>

<script> $(document).foundation(); </script>

And this is what it renders: enter image description here

But then I tried something like, (this doesn't work)

bundles.Add(new ScriptBundle("~/bundles/foundationjs").Include("~/Scripts/foundation.js")); bundles.Add(new ScriptBundle("~/bundles/foundationsupport").Include("~/Scripts/foundation.magellan.js"));

And then render then like this:

@Scripts.Render("~/bundles/foundationjs") @Scripts.Render("~/bundles/foundationsupport")

<script> $(document).foundation(); </script>

And this is what it renders: enter image description here

I tried to look if it returns a 404 error but it didn't. I tried clicking the button which clearly didn't work. How can I resolve this using bundling?

Any help would be much appreciated!

Boy Pasmo
  • 8,021
  • 13
  • 42
  • 67
  • This could be a lot of things. Check your console for JavaScript errors. Also, post the *rendered* HTML for those scripts, i.e. the actual HTML on page that calls them. – Chris Pratt Jul 08 '14 at 16:49
  • Updated my question. And I checked the console and no error found. – Boy Pasmo Jul 08 '14 at 16:56
  • They're different screenshot. Yea exactly, me too. Don't even have a clue why it didn't work. – Boy Pasmo Jul 08 '14 at 17:03
  • Nevermind. I saw the slight difference. It appears you're running locally, which means bundling doesn't actually *do* anything. The referenced scripts just get dumped to the page as is, as the screenshot indicates. That means, that bundling is not the issue here. The issue is the difference between `foundation.js` and `foundation.min.js`, as that's the only difference between the working solution and the failing one. – Chris Pratt Jul 08 '14 at 17:03
  • Perhaps try getting fresh copies of the files from the Foundation site and replace them. – Chris Pratt Jul 08 '14 at 17:04
  • Even tried that one but still didn't work. Anyhow, thanks mate. I guess I'll just have to move on to the project. Then come back to this if I have more time. – Boy Pasmo Jul 08 '14 at 17:09
  • Yep. Very weird. Normally you see this in reverse, where the normal script works fine and minified version is borked. Sorry I couldn't help more. – Chris Pratt Jul 08 '14 at 17:12
  • No, no, no. It's okay. It really helped me a lot. Thanks for pointing out the `foundation.min.js` and `foundation.js` didn't noticed that. And also for pointing out that I'm running locally. Really new to asp.net mvc though. – Boy Pasmo Jul 08 '14 at 17:15
  • Do you have a unminified version of foundation.js? Put it in there next to the min'd version. If you don;t have one, take min'd version and copy it into the same directory without the .min part. If you are not running with optimizations min files are ignored. – Mike Cheel Jul 08 '14 at 17:31
  • Yes. I have what you requested but still. Don't know why it didn't work. – Boy Pasmo Jul 11 '14 at 11:41

0 Answers0