Where to put scripts and styling for templates

If I create a template/include/mixin/etc for my website, the directory structure will look something like this:

/mywebsite   /js   /css   /views   /_includes 

And a template might look like


<div>   <ul>     <li>     ...     <li>   </ul> <div> 

Where should I put the scripts and styling for this template? As far as I can tell I have 3 options:

  1. Put it in the template. This allows my templates to be self-contained, but also makes it a hassle to make changes. It also breaks single responsibility.

  2. Put the styles and scripts in their own files in /_includes. This lets them each have single responsibility, but now I have styles and scripts outside of the designated /css and /js folders, which can make them hard to find.

  3. Put the styles and scripts in /css and /js. Now, I have very decoupled files where it might not be obvious that some files are for templates.

  4. Let the view handle it. If I include a template inside a view, then I must style and script it within that view specifically. This is nice because it’s modular and let’s you make tweaks based on the view. On the downside, you’re going to have a lot of repeat code.

Where should that code go?