structure for jquery in my mvc project

whats the best way of structure jqueryfiles in my mvc app. Now i have all my scripts in script folder and it starting to be difficult to have a good overview.

开发者_StackOverflow

//thanks

---

We used the following structure on my last project:

Scripts
|
|- jQuery
|- Libraries
|- Infrastructure
|- PageSpecific

jQuery contained jQuery and any plugins. Libraries contained other third-party libraries (e.g. underscore.js). Infrastructure contained shared JavaScript modules, e.g. one full of utility functions, or one for handling server-side account-management communications, etc. PageSpecific contained code to wire up event handlers and page-specific logic.

---

The HTML5 Boilerplate has some minimal structure for JavaScript already. Anything I do will likely be built on top of that because there is at least a chance that another developer will have encountered it prior to hitting it in my project.

Boilerplate has a "js" subdirectory that contains all the JavaScript, another directory under that called "libs" that has just jQuery and Modernizr, and a "mylibs" directory where you're directed to put all the third party libraries (for example, the libraries for jQuery templates or Lawnchair).

js
  libs
  mylibs
  plugins.js
  script.js

They also recommend your short plugins should be concatenated in plugins.js and your basic script stuff go into script.js. Of course, that won't work for a large project, but you've at least got a start with just the js, js/libs, and js/mylibs structure. At the moment I'm using a JavaScript per HTML file with a corresponding name (blahblah.html + blahblah.js) but long term I know I'm going to need more structure than that.

---

Keeping your JavaScript files in the Scripts folder is the way to do it. If you want, you can use subfolders within the Scripts folder so that it's a little more organized.

---

It is always a good idea to keep your css files and javascripts organized within your web application.

• Have two main folders 'styles' and 'scripts' in the root folder of your application.
• Inside each of these folders, create sub folders that reflect specific module in your app like 'jquery', 'blueprint' etc and place those files over there.