ck86 / gulp-bower-files

Build gulp.src() of your bower packages main files.
80 stars 13 forks source link

Ability to concat along with specifying dependencies. #32

Closed aamirshah closed 10 years ago

aamirshah commented 10 years ago

Obviously after getting the main files using bower.json, we will need to compile/concat them into one single file. This is now its done in Grunt. Looking forward to see same in Gulp.

We can use gulp.src and then pipe it to concat but the problem is how to specify the order of files automatically

Btw, great work so far.

ck86 commented 10 years ago

The order is the same as the order specified in your bower.json, but dependencies will be added before the actually package.

aamirshah commented 10 years ago

I did not understand but dependencies will be added before the actually package. Do you mean to say we need to organize the files in the bower.js in the order we want to have the output. Shouldn't there be an option to add/remove/override this behavior in the plugin ?

ck86 commented 10 years ago

Why do you want an extra option for that? You can "remove" packages in the overrides section if you ignore them:

{
  "overrides": {
    "PACKAGE": {
      "ignore": true
    }
  }
}

You can add files to stream, see: #31.

And the part you did not understand is may be better explained with an example:

You have angularjs and bootstrap install:

{
  "dependencies": {
    "angularjs": "*",
    "bootstrap": "*"
  }
}

You will get a stream with the main file(s) of angularjs and then of bootstrap. But bootstrap depends on jQuery. The main file(s) of jQuery will be set before bootstrap. So you should not have any problems if you concatenate these files.

aamirshah commented 10 years ago

Probably, now I've a better understanding of your plugin. Indeed its a great work :+1: One small question:

For this .json file

{
  "name": "aamir-shah",
  "version": "0.0.0",
  "dependencies": {
    "bootstrap": "*",
    "jquery": "~2.1.1"
  },
  "overrides": {

    "bootstrap": {
      "dependencies": "jquery"
    }
  }
}

It does not work, but if I place jquery before bootstrap everything works fine. In this case how can I tell gulp that bootstrap in dependent on jquery ?

ck86 commented 10 years ago

Which version do you have installed? This feature was added in version 0.2.x.

Normally it should place jquery before bootstrap without overriding, because bootstrap depends on jquery. I have tested it successfully, see the output with enabled debugging options:

[gulp] PackageCollection add         bootstrap bower_components/bootstrap
[gulp] PackageCollection add         jquery bower_components/jquery
[gulp] Package       select file     jquery bower_components/jquery/dist/jquery.js
[gulp] Package       select file     bootstrap bower_components/bootstrap/dist/css/bootstrap.css
[gulp] Package       select file     bootstrap bower_components/bootstrap/dist/js/bootstrap.js
[gulp] Package       select file     bootstrap bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.eot
[gulp] Package       select file     bootstrap bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.svg
[gulp] Package       select file     bootstrap bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf
[gulp] Package       select file     bootstrap bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.woff

In case of the package has dependencies, but it was not defined:

{
  "name": "aamir-shah",
  "version": "0.0.0",
  "dependencies": {
    "bootstrap": "*",
    "jquery": "~2.1.1"
  },
  "overrides": {
    "bootstrap": {
      "dependencies": {
        "jquery": "*"
      }
    }
  }
}
aamirshah commented 10 years ago

Finally I got it right in my generator.

@ck86 :+1: