CODEWITHSUNDEEP
angularjsgruntjs
Peter Clause
Peter Clause

Reputation: 1141

Best practices for sharing code between AngularJS applications

I'm developing several AngularJS applications and I'm looking for best practices how I can share code, especially directives, between these projects. The biggest problem I'm facing is the following:

Most of my directives contain at least one js file and a html template. The js file often contains a reference to the template. When I include the same js file from two different projects, what's the best way to handle the different paths?

There may be better ways to handle this situation I can't even think of. So, I would like to know if someone has experiences with this situation and how this is handled. Thanks!

Upvotes: 1

Views: 281

Answers (2)

Martin
Martin

Reputation: 16300

I find it helpful to use compiled HTML templates using a build tool like https://www.npmjs.com/package/grunt-angular-templates . There are plenty of Gulp/Grunt alternatives if that one doesn't suite your needs.

Then you will need to keep your templates in namespaced directories so that your consumer applications don't collide.

Then you when you just need to consume a single compiled JS file. The templates are compiled into it. If you need to override the templates in your applicatons, just use the template namespace convention to provide the overrides.

Upvotes: 1

Kędrzu
Kędrzu

Reputation: 2425

Maybe you can write your code in nodejs style (with CommonJS), locate your files in different folders and such, and then use browserify to combine your js code into one piece. HTML templates can be also easily transpilled into js files using angular template cache and some tool like this one for gulp or maybe some similiar for grunt.

Upvotes: 0

Related Questions