Geek asks and answers

Requirejs modules do not recognize key keys as keys and look for a key as if it were a file name

im new for requirejs and trying to get a simple structure (see below). ive tried several ways, but no luck with the paths.

My goal is to configure requirejs configuration to be shared across all pages.

my approach was for the bulk of the data in the script tag of each page to point to the module corresponding to that page (page.php to js / page.js). and from the corresponding module, call js / config.js as the first dependency. the problem was that the path keys did not work in the modules.

i then read that for the configuration you need to set the basic information in the script tag. so I tried, indicated the main data in js / config.js instead of the corresponding page code. then the second script tag on the page is added. first loading the loading of the script tag in the configuration, and then the second script tag is loaded into the module for the corresponding page. but the same problem with paths, in the path keys of the modules did not work.

the problem is that when I use the path key (say "jquery") in the module (['jquery']), the browser looks for the key "jquery" in the js folder, and not in the folder "libs / jquery 'path i, specified in js / config.js. so we added baseRrl to 'js /' and then tried '/ js' and then tried '/ js /' and also tried '/' infront values ​​in the paths object. no luck.

then I tried pointing to the google CDN for jquery and the browser still could not find it.

so I changed the key from "jquery" to "ooo", and still the browser looks for the ooo.js file in the js directory instead of searching for the CDN, as indicated in the configuration paths.

, / baseUrl. ive , . . , , . .

file structure : 
------------
index.php

js/
- config.js
- index.js

- libs/
-- jquery.js
-- require.js
------------

index.php:

<head>
    <script data-main="js/config" src="js/libs/require.js"></script>
    <script src="js/index.js"></script>
</head>
<body>
</body>

js/config.js:

require.config({
    baseUrl: 'js/',
    paths: {
        'ooo': 'http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min',
        //'ooo': 'libs/jquery',
        'mod': 'modules/module1'
    },
    shim: {
        'ooo': {
            exports: '$'
        }
    }
});

js/index.js:

require( ['ooo'], function( $ ) {

    $( document ).ready( function() {
        alert( 'work!' );
    });

});

"" dev:

GET http://localhost/requirejs/site2/js/ooo.js 404 (Not Found)
+3
1

data-main . data-main , RequireJS , , . , , , require in js/index.js js/config, . , require. , js/index.js :

define(['ooo'], function( $ ) {
    $( document ).ready( function() {
        alert( 'work!' );
    });
});

RequireJS :

deps: [ 'index' ]

(, index, js/index, js/index.js.) deps RequireJS . , js/index.js .

+1

More articles:


All Articles