Require.js and r.js include all dependencies even of submodules

I am using require.js for the first time, and everything works pretty well for now. However, I began to assemble the assembly. The idea is to create one file with all my js and templates. However, every time I use r.js, it just includes the dependencies of my main module.

here is my app.build.js:

({ appDir: "public/javascripts", baseUrl: ".", dir: "build", paths: { "hbs": "lib/hbs", "jquery": "lib/jquery", "Handlebars": "lib/Handlebars", "Backbone": "lib/backbone", "underscore": "lib/underscore", "bootstrap": "lib/bootstrap.min.js" }, modules: [{name: "main"}], shim: { "bootstrap": { deps: ["jquery"], exports: "$.fn.popover" }, underscore: { exports: '_' }, 'Handlebars': { exports: 'Handlebars' }, Backbone: { deps: ["underscore", "jquery"], exports: "Backbone" } }}) 

start of main.js:

 require.config({ paths: { "hbs": "lib/hbs", "Handlebars": "lib/Handlebars", "Backbone": "lib/backbone", "underscore": "lib/underscore", "jquery": "lib/jquery", "bootstrap": "lib/bootstrap.min.js" }, hbs: { disableI18n: true }, shim: { "bootstrap": { deps: ["jquery"], exports: "$.fn.popover" }, underscore: { exports: '_' }, 'Handlebars': { exports: 'Handlebars' }, Backbone: { deps: ["underscore", "jquery"], exports: "Backbone" } } }); require(['jquery', 'Backbone', 'videos'], function($, Backbone, Videos) { // Whatever }); 

In this case, the final file created in my assembly 'main.js' contains only: jquery, underline, trunk and video. How can I make sure that it also includes the dependencies of the videos module, namely: the "hbs! Template / videos / show" template. How can I also make sure bootstrap.min.js is also added, although it is not needed anywhere? Finally, should you remove require.config as it will define paths that should not be larger since all modules are in the final file?

+4
source share
2 answers

A link to your main configuration file is included in your app.build.js, and you can remove the specified modules, this should include all the dependencies used by the main module.

 ({ ... mainConfigFile: 'main.js', ... }) 

You can also skip paths and gaskets, as this is already indicated in the main. Bellow is a sample configuration that I use in one of my projects and works like a charm:

 ({ name: 'main', baseUrl: '../', // optimize: 'none', optimize: 'uglify2', exclude: ['jquery'], paths: { requireLib: 'require' }, mainConfigFile: '../main.js', out: '../main.min.js', // A function that if defined will be called for every file read in the // build that is done to trace JS dependencies. // Remove references to console.log(...) onBuildRead: function (moduleName, path, contents) { return contents; // return contents.replace(/console.log(.*);/g, ''); } }) 
+3
source

For the optimizer to include all nested dependencies, include this option in the assembly file or on the command line:

 { findNestedDependencies: true } 

This makes it work as you expected, and you don’t have to include all your dependencies in your main file. This is some kind of secret ... I never saw this in the docs, but read it somewhere on a random blog.

+7
source

Source: https://habr.com/ru/post/1478881/


All Articles