1"use strict";(self.webpackChunkworthyd_gatsby_ts=self.webpackChunkworthyd_gatsby_ts||[]).push([[9521],{4392:function(t,e,s){s.r(e),s.d(e,{Head:function(){return l.F},default:function(){return p}});var r=s(7294),i=s(5893),n=s(1151);function a(t){const e=Object.assign({p:"p",a:"a",span:"span",img:"img"},(0,n.ah)(),t.components);return(0,i.jsxs)(i.Fragment,{children:[(0,i.jsxs)(e.p,{children:["I've worked on a few projects where we crammed all of our javascript into one file. This made navigation of the file a sheer nightmare. Now, I use the ",(0,i.jsx)(e.a,{href:"http://smallsharptools.com/Projects/Packer/",children:"SmallSharpTools.com Packer"})," to cram all of my JS files into a single minified JS file. One of the last MVC project I worked on had 143 javascript files that were minified into a single one. There is one frustrating thing about this. You must build your project every time you change javascript code. You can also retrofit these methods for CSS files."]}),"\n",(0,i.jsx)(e.p,{children:"You can solve this by throwing an if statement around your JS includes like this:"}),"\n",(0,i.jsx)(e.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="text"><pre class="language-text"><code class="language-text"> <% if (!Model.IsDev) { %>\n \t<script src="/Scripts/all.min.js" type="text/javascript"></script>\n <%} else {%>\n \t<script src="/Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>\n \t<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>\n \t<script src="/Scripts/microsoftAjax.min.js" type="text/javascript"></script>\n \t<script src="/Scripts/microsoftMvcAjax.js" type="text/javascript"></script>\n \t<script src="/Scripts/MicrosoftMVcValidation.js" type="text/javascript"></script>\n <%} %></code></pre></div>'}}),"\n",(0,i.jsx)(e.p,{children:"This isn't too bad, but it can still be kinda messy if you are working on a large project. If you structure you directories to mimic your Views like I do (see image below) it becomes really tedious to manage every file and remember to add new js files to your includes."}),"\n",(0,i.jsx)(e.a,{href:"http://blog.worthyd.com/wp-content/uploads/2010/12/MessyScripts2.png",children:(0,i.jsx)(e.img,{src:"http://blog.worthyd.com/wp-content/uploads/2010/12/MessyScripts2.png",alt:"alt"})}),"\n",(0,i.jsx)(e.p,{children:"I wrote a simple HTML Helper that will help change this:"}),"\n",(0,i.jsx)(e.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="text"><pre class="language-text"><code class="language-text"> <script src="/Scripts2/AllYour/About.js" type="text/javascript"></script>\n <script src="/Scripts2/AllYour/JScript2.js" type="text/javascript"></script>\n <script src="/Scripts2/AllYour/Index.js" type="text/javascript"></script>\n <script src="/Scripts2/BaseAre/ForGreatJustice.js" type="text/javascript"></script>\n <script src="/Scripts2/BaseAre/SomeBodySetUsUpTheBomb.js" type="text/javascript"></script>\n <script src="/Scripts2/BaseAre/JScript1.js" type="text/javascript"></script>\n <script src="/Scripts2/BelongToUs/JScript1.js" type="text/javascript"></script>\n <script src="/Scripts2/BelongToUs/RandomJS.js" type="text/javascript"></script>\n <script src="/Scripts2/BelongToUs/JScript2.js" type="text/javascript"></script></code></pre></div>'}}),"\n",(0,i.jsx)(e.p,{children:"Into This:"}),"\n",(0,i.jsx)(e.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="text"><pre class="language-text"><code class="language-text"> <%= Html.IncludeJSDirectory("/Scripts2/AllYour/")%>\n <%= Html.IncludeJSDirectory("/Scripts2/BaseAre/")%>\n <%= Html.IncludeJSDirectory("/Scripts2/BelongToUs/")%></code></pre></div>'}}),"\n",(0,i.jsx)(e.p,{children:"Here is the code for the HTML Helper:"}),"\n",(0,i.jsx)(e.span,{dangerouslySetInnerHTML:{__html:'<div class="gatsby-highlight" data-language="text"><pre class="language-text"><code class="language-text"> using System.IO;\n using System.Text;\n\n namespace System.Web.Mvc {\n \tpublic static class IncludeHelper {\n\n \t\tpublic static string IncludeJSDirectory(this HtmlHelper helper, string directory) {\n \t\t\tDirectoryInfo dir = new DirectoryInfo(HttpContext.Current.Server.MapPath(directory));\n\n \t\t\tif (!dir.Exists)\n \t\t\t\treturn string.Empty;\n\n \t\t\tStringBuilder sb = new StringBuilder();\n\n \t\t\tstring href = string.Empty;\n \t\t\tforeach (var i in dir.GetFiles("*.js")) {\n \t\t\t\thref = string.Format("{0}{1}", directory, i.Name);\n\n \t\t\t\tTagBuilder _script = new TagBuilder("script");\n \t\t\t\t_script.MergeAttribute("type", "text/javascript");\n \t\t\t\t_script.MergeAttribute("src", href);\n\n \t\t\t\tsb.Append(_script);\n \t\t\t}\n\n \t\t\treturn sb.ToString();\n \t\t}\n \t}\n }</code></pre></div>'}}),"\n",(0,i.jsxs)(e.p,{children:["Currently, this doesn't support URLs leading with a tilde. I have a code snippet to handle it, but I didn't write it. I've been working with this solution for a couple of weeks and it works great on my local machine. It has made working with many Javascript files very easy. I would strongly recommend not using this for a production environment and to look into ",(0,i.jsx)(e.a,{href:"http://smallsharptools.com/Projects/Packer/",children:"SmallSharpTools.com Packer"})," to minify your javascript and css files."]})]})}var c=function(t){void 0===t&&(t={});const{wrapper:e}=Object.assign({},(0,n.ah)(),t.components);return e?(0,i.jsx)(e,Object.assign({},t,{children:(0,i.jsx)(a,t)})):a(t)},l=s(1785);const o=l.Z;function p(t){return r.createElement(o,t,r.createElement(c,t))}}}]); 2//# sourceMappingURL=component---src-templates-post-query-ts-content-file-path-content-blog-2010-12-manage-scripts-styles-md-e76704b0a1f419469b41.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.