Try some tools for fast development, and trace dependencies in a project.
Allows to require dependencies from npm to the browser (by default uses CommonJs) bundling up as you need... and more.
Maps the source code, this was introduced with HTML5
Trace dependencies for CommonJs, AMD, ECMA2015 modules
Gulp as a task manager, provides a watcher of source code changes to trigger your own tasks.
Rebundle code with browserify using cache to produce small changes.
This are the results on creating the diagram of dependo for an angular application.
In this case we can say, that the application works with controllers for login and posts.
Also we can see that there are two other modules, blog core and ui blog. Those modules will handle services and directives that are reusable for some of the controllers of the blog.
Gulp watch can handle all of the updates related to assets, markup, and sass.
This is a task that triggers every time gulp watch or watchify says.
Browser sync will synchronize the browser with latest updates.
Substack(author of browserify) created a little module called watchify. It works as browserify, but makes the bundle with those little changes.
Live reload when creating things.
No need for bower, npm can do it.
Synchronize many devices / browsers to see how the impact of our changes are working
Track dependencies in the project, commonjs / amd / Ecma2015.
See local code and debug it, even after minification.
Here are the implementations of this tools for a simple blog. The comments and posts are fake, just in order to work with the front end.