javascript - RequireJS doesn't work on a multipage project with CDN hosted libraries (jQuery) -

-

i'm using requirejs on multipage project, javascript folder structure looks kinda (how make fancy dir trees again in markdown?):

common.js lib/ -- jquery-1.9.1.min.js -- modernizr-2.6.2.min.js -- underscore-amd.min.js page/ -- index.js -- start.js -- checkout.js

anyway, common.js main script file set configuration parameters. looks like:

common.js file

// configure requirejs requirejs.config({     baseurl: "assets/js/lib",     paths: {         page: '../page',         jquery: [             '//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min',             //if cdn location fails, load location             'jquery-1.9.1.min'         ],         modernizr: [             '//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min',             //if cdn location fails, load location             'modernizr-2.6.2.min'         ],         underscore: [             'underscore-amd.min'         ]     } });

all page calls work expected (with cdn location being loaded), can't head around minification part. r.js optimizer refuses cooperate, throwing error: paths fallback not supported in optimizer. please provide build config path override underscore though underscore doesn't have cdn specified.

build.js file

{     appdir: '../www',     baseurl: 'js/lib',     dir: '../www-built',     mainconfigfile: '../www/assets/js/common.js',     modules: [         //first set common build layer.         {             //module names relative baseurl             name: '../common',             include: ['jquery',                       'modernizr',                       'underscore'             ]         },         // page scripts         {             //module names relative baseurl/paths config             name: '../page-index',             include: ['page/index'],             exclude: ['../common']         },     ],     paths: {         jquery: "empty",         modernizr: "empty"     },     optimize: "uglify2",     removecombined: true }

please me figure out how build project create common.js script along individual page scripts.

(note: based structure of build.js file on this example

updated!

i've updated question include correct syntax empty: (thanks travis!), , build runs without error. however, js files not concatenated or uglified. css files are, @ import points, something's happening. complete build.js file below (forgive me, she's tall one):

{     appdir: '../www',     baseurl: 'assets/js', // relative appdir     dir: '../www-built',     mainconfigfile: '../www/assets/js/common.js',     modules: [         //first set common build layer.         {             //module names relative baseurl             name: 'common',             //list common dependencies here. need list             //top level dependencies, "include" find             //nested dependencies.             include: ['jquery',                       'modernizr',                       'underscore',                       'bootstrap'             ]         },          //now set build layer each page, exclude         //the common one. "exclude" exclude nested         //the nested, built dependencies "common".         //"exclude" includes built modules should         //listed before build layer wants exclude it.         //"include" appropriate "app/main*" module since default         //it not added build since loaded nested         //require in page*.js files.         {             //module names relative baseurl/paths config             name: 'pages/home',             include: ['pages/home'],             exclude: ['common']         },         {             //module names relative baseurl/paths config             name: 'pages/start',             include: ['pages/start'],             exclude: ['common']         },         {             //module names relative baseurl/paths config             name: 'pages/checkout',             include: ['pages/checkout'],             exclude: ['common']         },     ],     paths: {         jquery: "empty:",         modernizr: "empty:" //        underscore: "empty:"     },     optimize: "uglify2",     optimizecss: "standard",     removecombined: true,     preservelicensecomments: false }

final update (yaay! it's working)

thanks travis below, working great! (the files getting minified , concatenated). since solution hosted on dropbox, , lost in future (who knows amirite?), i'll sum fixes made:

1. don't mix define , require calls in single file.

i had couple of files i'd mixed them so:

page/start.js

 define(['jquery','underscore'],function($,_) {       ...  });   require(['jquery','page/start'], function($, y) { // bad!       ...  });

and fix this:

page/start.js

 require(['jquery','app/start_helper'], function($, y) {       ...  });

app/start_helper.js

 define(['jquery','underscore'],function($,_) {       ...  });

2. it's "empty:" not "empty"

that's tricky one, though requirejs docs mention them.

3. because

what kind of list has 2 bullet points?

awesomelicious - works charm :)

looks requirejs thinks you're trying provide paths fallback underscore, since you're specifying path value array. try doing string instead.

paths: {     underscore: 'underscore-amd.min' }

also note correct symbol empty paths empty: (with ':') not empty.

finally, unrelated side note @ lodash imho more customizable, cross-browser compliant, faster underscore replacement identical api , it's hosted on cdnjs , amd-compliant

update

following on conversation within comments, here's updated version of project: https://dl.dropboxusercontent.com/u/21823728/so_rjs.tar.gz

as mentioned in comments, problem seemed defineing modules within same file requiring modules in, , believe causing r.js believe these modules had no main entry point. convention separate out module definitions files require modules.

notice there's app folder under assets/js each module used defined within page modules stored. page modules require these modules in. when re-ran r.js (using uglify2 optimizer) seemed work expected.

furthermore, removed redundancy build.js file (you have specify baseurl in mainconfigfile if that's 1 you're using build configuration well). finally, may want using shim config if want attach jquery , bootstrap globally every page. otherwise should explicitly list them dependencies when need them.

finally 1 last piece of advice may want @ cutting down on number of require within each file. of pages wrap in 1 require call , separate out different logic functions save space on event queue , cycles of having redundantly call require function.


Comments

Post a Comment

Popular posts from this blog

css - Which browser returns the correct result for getBoundingClientRect of an SVG element? -

-
this svg contains rect overflows svg element: <svg id='svg' width='10' height='10'> <rect x='-10' y='-10' width='30' height='30'/> </svg> chrome 28 , opera 12 return getboundingclientrect() svg element width , height of 10. firefox 23 reports width , height of 30. correct? jsfiddle the relevant spec cssom , delegates svg spec if svg element not "have associated css layout box". haven't found definition of "having associated css layout box", correct result seem hinge on definition, getbbox returns 30x30 rect in browsers. this firefox bug fixed now, fix in firefox nightlies , should make through firefox 33 released on 14 october 2014. see bug 530985 details.
Read more

gcc - Calling fftR4() in c from assembly -

-
i trying asm fft implementation www.embeddedsignals.com work. running make gives error: undefined reference fftr4(short*, short*, int) at top of asm have .syntax unified .thumb .global fftr4 .type fftr4, %function and there #define's associate c functions arguments registers followed macros fftr4 function uses. after that, fftr4 called .thumb_func fftr4: stmfd sp!, {r4-r11, lr} mov tmp0, #0 // bit reversed counter mov tmp1, #0 .word 0xf3a2fa92 //rbit r3,r2 //rbit r,n lsl r,#3 and c code follows: void fftr4(short *y, short *x, int n); short x[512]; short y[512]; int i; void loop() { (i=0;i<512;i++) x[i]=0; (i=0;i<512;i=i+8) { x[i+0]=16384; x[i+2]=16384; x[i+4]=-16384; x[i+6]=-16384;} fftr4(y, x, 256); serialusb.println(y[128]); serialusb.println(y[129]); serialusb.println(y[384]); serialusb.println(y[385]); // expected results: //y[128]is 8191; y[129] -8190 y[...
Read more

.htaccess - Matching full URL in RewriteCond -

-
i'm trying block post access site (and return 403), except 2 ip's , 1 url ( http://mydomain.com/about-us/contact-us/ ). here's have: rewritecond %{request_method} post rewritecond %{remote_addr} !=1.2.3.4 rewritecond %{remote_addr} !=4.3.2.1 rewritecond %{request_uri} !^http://mydomain.com/about-us/contact-us/$ rewriterule ^ / [f] these rules allowing access ip properly, contact page still not accessible. i'm not sure i'm using request_uri correctly? i've tried variations relative urls rewritecond %{request_uri} !^/about-us/contact-us$ , rewritecond %{request_uri} !^/about-us/contact-us/$ without luck. what doing wrong please? it looks me rule on file name specific. if relax bit, should work. made few other esthetic tweaks. give try: rewritecond %{request_method} post rewritecond %{remote_addr} !^1.2.3.4 rewritecond %{remote_addr} !^4.3.2.1 rewritecond %{request_uri} !about-us/contact-us rewriterule ^ - [f]
Read more