2

I'm building an AngularJS application. I don't have external dependencies, but I do have my application broken up into different files for controllers, services, etc.

I'd like to combine all this JS into a single file, so the browser has to make one request to get all the code rather than multiple requests (one for each file). Minification would also be nice.

From what I've been reading so far, Browserify is what I need to use. Does that sound about right? Is there anything folks recommend over this solution?

1 Answer 1

4

You can start using Grunt or Gulp. With these tools you can do much more than just concat and minify your files. For example if you choose to use Gulp:

  • you will have to download gulp-cli $ npm install --global gulp-cli

  • then create a gulpfile.js in your project and add gulp as dependency $ npm install gulp --save

  • then add gulp-concat package which will concatenate your files $ npm install gulp-concat --save
  • and finally add some code which will concat your files. Here is an example.

Leave a comment if you need any further help. Good luck!


Using Grunt here is an example gruntfile, assuming you have three different directories for controllers, directives and services for example. I also added watch plugin in case you need it.

$ npm i grunt-cli -g
$ npm i -D grunt
$ npm i -D grunt-contrib-concat
$ npm i -D grunt-contrib-uglify
$ npm i -D grunt-contrib-watch
Sign up to request clarification or add additional context in comments.

3 Comments

For reasons beyond my control, I will have to use Grunt. With that said, thanks for clarifying that I can do this without browserify. I am looking into using grunt-contrib-concat (github.com/gruntjs/grunt-contrib-concat). This seems like it'll do what I want (combine into one file and minify). Please do tell me if even this seems overkill.
Grunt will of course also do the job. Let me update the answer with a grunt configuration.
This was very helpful. I'd give another upvote if I could. Thanks a ton!

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.