Preprocess HTML to add script tags automatically? (usemin) #661

Closed
callumlocke opened this Issue Oct 23, 2012 · 15 comments

Projects

None yet

8 participants

@callumlocke

I want to be able to put something like this in my index.html:

<!--[scripts]
  scripts/vendor/*
  scripts/models/*
  scripts/views/*
  scripts/collections/*
  scripts/helpers/*
-->

...and have yeoman server and yeoman build convert it into script tags for all .js and .coffee files found in those directories.

Is it possible to do something like this with Yeoman? Or might it be possible one day?

@hemanth
Member
hemanth commented Oct 25, 2012

First of all this is a very clean idea! Something like this can be done easily with shelljs, will give it a try!
Getting those files are as esay as : find('.').filter(function(file) { return file.match(/\.js$/); }); to get all js files.

@sindresorhus
Member

I like the idea.

@hemanth No need to use Shell.js, just need to make the usemin.js thingy use grunt.expandFiles (which supports globbing).

@sleeper
Contributor
sleeper commented Nov 6, 2012

What about something like:

<!-- build:expand_js js/app.js -->
  scripts/vendor/*
  scripts/models/*
  scripts/views/*
  scripts/collections/*
  scripts/helpers/*
<!-- endbuild -->

This will allow to keep "standard" markers ...

@sindresorhus
Member

What is expand_js ?

@sleeper
Contributor
sleeper commented Nov 6, 2012

The proposal: currently the 2 only types are css and js. Having another one (expand_js) would allow to mark this new logic (i.e. each line is a glob for a list of JS files) ... Or we can just use js type, and normal <script> declarations but detect globbing ... Something like:

<!-- build:js js/app.js -->
<script src="scripts/vendor/*"></script>
<script src="scripts/models/*"></script>
<script src="scripts/views/*"></script>
<!-- endbuild -->

Yeah ... Thinking about it I like this last example ! ;)

@sindresorhus
Member

I agree, like the last one.

@julrich has shown interest in helping out and I suggested to him to extract the usemin task into its own separate generic task, which has to be done. @sleeper Just wanted to let you know seeing as you done some really good fixes on it lately. Maybe you want to help out with the effort or something :)

@sleeper
Contributor
sleeper commented Nov 6, 2012

Sure ! @julrich, anyway I can help ?

@julrich
julrich commented Nov 6, 2012

Hey @sleeper, currently working through the existing tests, adding some new ones.

Will start extracting the code after that, not sure yet how you could help the best, but will definitely keep that in mind! Especially as you seem to have spent quite some time with usemin already (think I've seen your name way more than once when looking through some other issues on here :) ).

@sleeper
Contributor
sleeper commented Nov 6, 2012

Do not hesitate ! ;)

Frederick Ros
Sent with Sparrow (http://www.sparrowmailapp.com/?sig)

Le mardi 6 novembre 2012 à 11:33, Jonas Ulrich a écrit :

Hey @sleeper (https://github.com/sleeper), currently working through the existing tests, adding some new ones.
Will start extracting the code after that, not sure yet how you could help the best, but will definitely keep that in mind! Especially as you seem to have spent quite some time with usemin already (think I've seen your name way more than once when looking through some other issues on here :) ).


Reply to this email directly or view it on GitHub (#661 (comment)).

@hemanth
Member
hemanth commented Nov 6, 2012

So the final plan being

@Munter
Munter commented Nov 6, 2012

I disagree with this being a clean idea. I also disagree with this being a good idea at all.

Globbing files disregards their internal dependencies and thus also the order of inclusion.

What you need to do is describe your dependency chain in your source files with a module loader like requirejs and then have your build system traverse the dependencies in post-order so the included files are in correct order.

An added benefit of this is that your unbuilt development environment will work out of the box and that the built bundles will only include the files you actively include rather than what happens to be at that point in the file system.

@sindresorhus
Member

@Munter This is only for non-RequireJS users, and globbing should only be used when you don't have to care about the order, like in the example above.

@juggy
juggy commented Nov 21, 2012

@Munter You should be able to specify the files that need to be included in a particular order and then add a **/** to include all others (and not reincluding the previous ones).

Requirejs is overdone most of the time for most projects small or big (I have projects with over 200 js files and no need for require).

edit: escape stars

@Mattieuga

Are there any plans on releasing this feature? It would be great to have js globbing.

@sindresorhus sindresorhus referenced this issue in yeoman/grunt-usemin Jan 31, 2013
Open

Globbing #37

@sindresorhus
Member

Continue discussion in yeoman/grunt-usemin#37

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment