2

I am quite new with GruntJS and I wonder if it is possible to have a task that loads some RequireJs modules to process them and write the result within a JS file.

I describe my scenario:

I have a RequireJs based project with many files. I would like to concatenate/minify/etc the project to deploy it and increase performances, etc.

The optimization works perfectly with the grunt-contrib-requirejs plugin. The grunt-contrib-requirejs plugin works with a main.js file and I should need to generate it dynamically.

I would like to generate the main.js processing some RequireJS module of the project (call them fileA.js and fileB.js). I would like to use the generated main.js to run the grunt-contrib-requirejs plugin.

So the task sequence would be something like:

Custom Task:

  1. loads fileA.js and fileB.js
  2. merge them together
  3. write the result of the merging within a new JS file

grunt-contrib-requirejs task:

  1. use the generated main.js file to optimize the project

Do you know how can I achieve this? I don't have any kind of restrictions on the way/tools/libs to use.

Bojangles
  • 99,427
  • 50
  • 170
  • 208
  • 1
    Do u want us to give you detailed code of the procedure you listed? procedure mentioned is standard way of doing, you just need to implement it... – Vishwanath May 23 '15 at 15:34
  • 1
    @Vishwanath thank you for your reply. I will set a GitHub repository to show you what i mean. Thank you again. – Daniele Salvatore May 25 '15 at 07:52
  • @Vishwanath here you can find the project. https://github.com/danielefenix/requirejs-grunt-dynamic-main – Daniele Salvatore May 25 '15 at 10:31
  • What is the problem with staticMain.js? – Vishwanath May 26 '15 at 08:39
  • Btw you can use phantom browser task to emulate the load and then read `requirejs.s.contexts._.defined` property from the top level object. – Vishwanath May 26 '15 at 08:43
  • I can not rely on the staticMain.js because its RequireJS configuration is the object I would like to build dynamically during. My scenario is similar to the dynamic.html situation in which the RequireJS configuration comes from the merge of different files. This is a condition (that unfortunately i can not get rid of it from the project given its nature) that makes less effective the optimization with grunt-contrib-requirejs. That's why i would like to write the 'staticMain.js' with a grunt task from the files and give it as parameter of the next task (grunt-contrib-requirejs). – Daniele Salvatore May 26 '15 at 10:55
  • You told that it is possible to load the files with phantomjs. Would you mind to link an example of it? Would it be possible to write a file (e.g with grunt-writefile) from the phantomjs task (e.g the result of the merge)? @Vishwanath thank you very much for your kind support – Daniele Salvatore May 26 '15 at 10:58

1 Answers1

1

You can load RequireJS in Grunt, as follows:

var requirejs = require('requirejs');

You can then fetch all the fileX.js files in your tree through Grunt:

grunt.file.recurse('js/modules/', function callback(abspath, rootdir, subdir, filename) {
    if (filename === 'fileX.js') {
      /* Do something here. */  
    }
}

Once you have all the modules you need you can use r.js to minify/concatenate them.

Kalimaha
  • 328
  • 3
  • 10