I am struggling with the requirejs optimizer. This code will work if I just load it in the browser without optimization. If I run the optimizer I get
: ENOENT, no such file or directory 'C:\Users\dev\checkout\src\main\webapp\resources\scripts\ json2.js' In module tree: main
This is the code
requirejs.config({ paths : { jquery : "lib/jquery", bootstrap : "lib/bootstrap", modals : "lib/modals", tablesort : "lib/tablesort", json2 : "lib/json2" }, shim : { "bootstrap" : [ "jquery" ], "modals" : [ "jquery" ], "tablesort" : [ "jquery" ], "json2" : [ "jquery" ] } }); require([ "jquery", "json2","bootstrap", "modals", "tablesort", "registermodule", "personsmodule" ], function($) {
What needs to be done to get the optimizer working? I tried putting lib/json2 in the require. Then I get jQuery issues because it is non AMD modules.
Edit: still struggling with this one. Tried the simpliest example. Works fine in browser but the optimizer complains about not finding the files. lib/jquery.js and lib/modal.js.
requirejs.config({ paths : { jquery : "lib/jquery", modals : "lib/modals" }, shim : { "bootstrap" : [ "jquery" ], "modals" : [ "jquery" ] } }); require([ "jquery", "modals" ], function($) { console.log($("#leverandor_span").text()); $("#register_modal").modal("show"); });
The problem: the require.config() is not parsed by r.js. That configuration is only for runtime. For r.js we need to create another file to configure the paths and other stuff.
Create a file (e.g app.build.js) and configure the paths
({ appDir: "../", baseUrl: "./", dir: "dist", modules: [ { name: "bootloader" } ], paths: { // libraries path "json": "lib/json2", "jquery": "lib/jquery", "underscore": "lib/underscore", "bootstrap": "lib/bootstrap", "backbone": "lib/backbone", "hogan": "lib/hogan", // require plugins "css": "lib/css", "hgn": "lib/hgn", "text": "lib/text" } })
run the optimizer:
$r.js -o app.build.js
More details here: http://japhr.blogspot.it/2011/12/optimizing-requirejs-part-2.html
Build file options: http://requirejs.org/docs/optimization.html#wholeproject
See mainConfigFile. This was put into place so you do not have to copy your require configuration into runtime/optimize-time files, keeping your build DRY:
//By default all the configuration for optimization happens from the command //line or by properties in the config file, and configuration that was //passed to requirejs as part of the app's runtime "main" JS file is *not* //considered. However, if you prefer the "main" JS file configuration //to be read for the build so that you do not have to duplicate the values //in a separate configuration, set this property to the location of that //main JS file. The first requirejs({}), require({}), requirejs.config({}), //or require.config({}) call found in that file will be used. mainConfigFile: '../some/path/to/main.js',
