How to optimize all javascript files in a directory with requirejs

Question

I have a folder structure like this:

.
├── autocomplete
│   ├── core.js
│   ├── search.js
│   └── user.js
├── build.js
├── collapsible_lists.js
├── griffgrabber
│   ├── canvasobject.js
│   ├── cargame.js
│   ├── car.js
│   ├── griffDrawer.js
│   ├── keylistener.js
│   ├── run.js
│   └── victim.js
├── main.js
├── newsfeed.js
├── require.js
├── shortcut.js
└── sidebar.js

3 directories, 20 files

main.js is the startup file. That file requires a couple of the files, but not all of them. The rest of the files are included with

<script>
    require(['shortcut'], function(shortcut){
        // ...
    })
</script>

in some html files.

This is my build.js file so far:

{
    baseUrl: ".",
    name: "main",
    out: "main-built.js",
}

But it only includes the files that are required by main.js. Is it possible to optimize all the javascript files in one run?

kryger · Accepted Answer · 2013-05-09 22:24:58Z

1

(to expand @Ryan Lynch's suggestion):

Use the include option, as per the documentation:

You can always explicitly add modules that are not found via the optimizer's static analysis by using the include option.

(http://requirejs.org/docs/optimization.html)

{
    baseUrl: ".", // ?
    appDir: ".", // ?
    dir: "output/",
    modules: [
        {
            name: "main",
            include: [ "shortcut" ]
        }
    ]
}

More detailed example in the excellent example.build.js (I actually find it more useful than the documentation page)

(sorry, had no time to replicate and test properly to make sure the paths values are correct, I'll try that later and update my answer)

edited May 9, 2013 at 22:24

answered May 9, 2013 at 20:05

kryger

13.2k8 gold badges47 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Ryan Lynch · Accepted Answer · 2013-05-09 17:38:42Z

0

Try including a modules array in your options, so:

{
    baseUrl: ".",
    out: "main-built.js",
    modules: [
        {
            name: "main"
        }
    ]
}

As per the documentation:

In the modules array, specify the module names that you want to optimize, in the example, "main". "main" will be mapped to appdirectory/scripts/main.js in your project. The build system will then trace the dependencies for main.js and inject them into the appdirectory-build/scripts/main.js file.

answered May 9, 2013 at 17:38

Ryan Lynch

7,7861 gold badge28 silver badges34 bronze badges

1 Comment

sighol Over a year ago

The build file you posted won't work for me. It seems like if I use modules, I have to drop the 'out' statement and add a 'dir' statement. When I use 'dir', it optimizes the whole directory and copies the optimized files to another directory. But it does not include every file into the main-built.js file.

kryger · Accepted Answer · 2013-05-09 20:27:13Z

0

Another - less orthodox - way of achieving this would be to add this "shortcut" module as a dependency to any of the "visible" modules that are discovered by r.js scanning (i.e. "main.js"). This way the entire dependency branch starting at "shortcut" would be included in the output.

edited May 9, 2013 at 20:27

answered May 9, 2013 at 20:22

kryger

13.2k8 gold badges47 silver badges68 bronze badges

Collectives™ on Stack Overflow

How to optimize all javascript files in a directory with requirejs

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related