CODEWITHSUNDEEP
gruntjsyeoman
lessless
lessless

Reputation: 896

yeoman: how to compress components?

In yeoman application all my scripts are minified and compressed into single file, but all the "components" are copied as is which is an absurd - because it's a ~130 files in the starter project... This what I belive is responsible for the concatenation task and the question is how to make it include my components which are mentioned in the index.html file? What parameters are to the files object are? Can't find anything in the documentation.

 concat: {
      dist: {
        files: {
          '<%= yeoman.dist %>/scripts/scripts.js': [
            '.tmp/scripts/{,*/}*.js',
            '<%= yeoman.app %>/scripts/{,*/}*.js'
          ]
        }
      }
    },

Upvotes: 0

Views: 315

Answers (1)

imjared
imjared

Reputation: 20554

I think what you're looking for is grunt-usemin.

When you include your components, you can wrap your <script> tags in <!-- build:js js/foo.js -->.

    <!-- build:js js/main.js -->
    <script src="js/carousel.js"></script>
    <script src="js/index.js"></script>
    <!-- endbuild -->

The useminPrepare task that's included in the package will cycle through any scripts within that block and add them to the concat/uglify task. Your task list might then include something like this:

useminPrepare: {
  html: [ '<%= yeoman.dist%>.html' ],
  options: {
    uglify: 'uglify'
  }
},

usemin: {
  html: [ '<%= yeoman.dist%>.html' ],
  options: {
    basedir: 'dist'
  }
},

Output to your foo.html would then be whatever you specify in the build comment. In my case, the scripts are concatenated, minified, and the reference to them is replaced with <script src="js/main.js"></script>.

Upvotes: 1

Related Questions