I have a bit experience in JavaScript development but I'm quite new in modern development tools such as Yeoman, Grunt or Bower. But I can create webapps with RequireJS, separate logic with Backbone.js and use templating with Handlebars. I am aware of what's going on.
I saw that these tools leads you to concat files, which is great, in my case I want to speak about JavaScript files. I can't understand how it works.
With RequireJS, I can separate files, for example if I'm using Backbone.js, every model, every view can be a file. If my application is big enough, some pages will need some models and some other pages will need some other models. And thanks to RequireJS I can load only the models (I mean the files, then) I need.
So, how can RequireJS work with modern tools ? Grunt will make me a single application.js file which content all the concatenated and minified JavaScript files in my scripts
directory. In these scripts are some RequireJS instructions like :
require(['my-model'], function (MyModel) {/* some code here */})
But know I have one single JavaScript file and my application is serving only this one. I got a 404 error answer from my my-model
RequireJS instruction. Moreover, all my application's JavaScript code is now loaded in every pages, even models I don't need.
I can see how powerful these tools are and how the JavaScript (and generally develoment) community is active on them, so I guess I missed something. I guess something is wrong with what I just said because I can find blog articles speaking of "Grunt using RequireJS" but I never find in these articles part of what I'm saying. So I guess I ask wrong questions.
I'm looking for someone to explain me why I'm wrong and how to use these wonderful tools. I want Grunt to manage my projects and I want RequireJS to load only code I need and work in develoment and production.
Thank you to all and let's talk!
Hey Paul, thanks!
You mean, if I configure all my modules in the
require.config
object likeRequireJS will load the code even if the file doesn't exist (in production) ?
I won't to this but just to understand better how RequireJS works, what if I have two models in the same file in development environment but I want to load only one model in my page ? How must I create my
require.config
object to make RequireJS understand which code to load ?(Btw, let me know how you're doing by email ;) )