requirejs

本人文笔很烂请见谅，欢迎吐槽和各种拍砖！分享快乐！ 关于RequireJS入门与好处，这里就直接略过了。（网上有很多）， 我们就以OSchina.net为例，看看应用RequireJS是如何模块与优化JS的。 首先我们来看看 OSchina.net的首页JS的加载情况与页面源代码。 从这个加载可以看出如下问题： JS没有做任何的压缩与合并。 页面与JS代码耦合在一起。 看看应用RequireJS是如何优化OSchina站点的。 第一步：将页面所需要的JS，在require.config()进行配置。如： require.config({ baseUrl : 'scripts/', paths : { 'jquery':'vendor/jquery/1.7.1/jquery', }, shim : {//配置依赖，关系到加载顺序 'vendor/jquery.form':['jquery'], 'vendor/jquery.fancybox-fixed':['jquery'], 'vendor/jquery.poshytip.min':['jquery'], 'vendor/oschina':['jquery'], 'vendor/utils':['jquery'], 'vendor/channel':['jquery'] } }); 第二步：对首页进行，模块化封装。oschina

So if i have some module like: //test1.js define([], function() { var counter = 0; return { increment: function() { counter++ } }; }); Requirejs will load this module once(to be aware of local variables of this module) and never again? Variable counter will be alive through closure from returning object(through increment function)? What about next example? //test2.js define([], function() { var value = 10; document.getElementById('asd').addEventListener('mousedown', function(e) { value = Math.random(); }); return value; }); With this structure of code this event never get triggered because

I'm trying to build a huge Modular Web App with AngularJs and RequireJS. This is my directory that I want to build: |--index.html |--css |--images |--libs | └--angular.js | └--angular-route.js | └--require.js | |--js | └--app.js | └--controller.js | └--module |--user | |--controller | | └--index.js (that is controller to list all users) | | └--add.js (this controller to add new user) | |--service | | └--user.js | └--template | └--index.tpl.html | └--add.tpl.html | └--photo |--controller | └--index.js | └--add.js |--service | └--photo.js └--template └--index.tpl.html └--add.tpl.html In app.js

I use the require.js - when i use the requiredjs, i am not get the underscore and backbone while i console without using shim's export modoule. But jquery not asking this export shim dependent.. so, why we need to use the shim and it's export for the underscore and backbone? here is my code: requirejs.config({ baseUrl: 'js', paths: { "jquery":'lib/jquery-1.9.1.min', "underscore":"lib/underscore-min", "backbone" : "lib/backbone-min" }, shim:{ "underscore":{ exports: '_' //what is does here? without this i am getting undefined }, "backbone":{ exports: 'Backbone' //what is does here? without this

I'm using the requirejs optimiser and I have a lot of JavaScript files for this webapp. I would like to create separate minified scripts which group scripts for certain sections of the site. My question is: how do I create minified groups of scripts and how I prevent script libraries for example JQuery from being added into these module groups which already exist in the scripts.min.js core script? ({ baseUrl: '../static/js', mainConfigFile: '../static/js/main.js', name: 'main', out: '../static/js/scripts.min.js', paths: { requireLib: 'vendor/require/require.min' }, include: ['requireLib', '

I'm using RequireJS on our site and before the files are deployed to production we are using rjs to minify the files. Currently I am creating several minified files, not a single file. For better load times on our site we are also using multiple CDNs so the browser will open more download streams and the static content will load as fast as possible. Here lies my problem. I can configure RequireJS through the baseUrl parameter to load my scripts from our CDN, but is there a way to configure RequireJS to use a random baseUrl? I know by default this isn't possible, but I was hoping maybe someone

I'm trying to figure out how to use r.js. I keep getting errors thrown such a module path does not exist, or files getting dumped where they shouldn't be. I've got a single page application that is integrated with wordpress. I've adopted this backbone boilerplate for my general structure, although I've set things up quite different. My file structure is shown below. .Theme Folder ├── _assets | ├── _application | | ├── css | | ├── fonts | | ├── img | | ├── _js | | | ├── main.js //this is my require.js config file | | | ├── _app //here's where the boilerplate structure comes into play | | | ├──