Bower and dependency development

Question

I'm developing an application myapp using angularJS with Yeoman Generator. This includes Bower to manage dependencies, and Grunt to wiredep those dependencies into index.html (=It generates index.html file with all scripts and links based on bower configuration and dependencies).

I have angular-gantt as a dependency, which is distributed through Bower as a single .js file.

As I want to contribute to angular-gantt, i've used bower link to read sources from a local cloned git repository.

But i still need to override the bower main property from myapp to use the javascript source files from this folder, instead of the single distributed one.

Is there an automated way to to this, without listing one by one each source files ? Is there some generator to build this list from sources ?

myapp/bower.json

{
  "name": "myapp",
  "version": "0.0.0",
  "dependencies": {
    ...
    "angular-gantt": "~0.6.1",
    ...
  },
  "devDependencies": {
    ...
  },
  "overrides": {
    ...
    "angular-gantt": {
      "main": [ // <= How to avoid listing those files manually ?
        "file1.js",
        "file2.js",
        "file3.js",
        "file4.js",
        ....
      ]
    },
    ...
  }
}

angular-gantt/bower.json

{
  "name": "angular-gantt",
  "version": "0.6.1",
  "homepage": "https://github.com/Schweigi/angular-gantt",
  "authors": [
    "Schweigi"
  ],
  "description": "A Gantt chart directive for Angular.js without any other dependencies.",
  "main": [
    "./assets/angular-gantt.js",
    "./assets/gantt.css"
  ],
  .......
}

This is an interesting question. I know Visual Studio allows you to put JavaScript comments in your files declaring what it depends on, but I'm not sure if there is a non Visual Studio solution. — Greg Burghardt
why do you override the bower main property and not use the single distributed one? — user3995789
If i make changes, i wan't them to be in the right source file. I don't wan't to spend time copy/pasting changes from distributed file to source file. — Toilal

Toilal Toilal · Accepted Answer · 2014-09-03T06:09:37

If other people have this problem, here is the solution i've finally found.

angular-gantt is using grunt concat and uglify that both supports sourceMap option. When enabled, a sourceMap is generated along with distribution .js file.

Intellij IDEA can read this sourcemap to debug from real sources while keeping the distributed file in the runtime environment. This require no configuration, as the sourceMap filename is added as a comment to the end of the distribution .js file.

With a grunt file watch, minified file can be automatically generated when sources are changed.

So by using an IDE supporting sourceMap, and grunt watch to check changes and build distributed .js file on source changes, the problem is solved.

Bower and dependency development

1 Answers