CODEWITHSUNDEEP
javascriptrequirejs
Johnny5
Johnny5

Reputation: 513

why doesn't this simple require.js setup work?

I'm trying to learn how to use require.js to load my scripts, but something is wrong with my setup/understanding. I can't see what is wrong. It is something simple with the setup that I'm missing.

When I load this index.html page in chrome, none of the script require.js action is working.

***index.html

<html>
<head>
   <title>My Sample Project</title>
</head>
<body>
   <h1 class="h1">sample project header</h1>
   <script data-main="main" src="require.js"></script>
</body>
</html>

***main.js

(function() {
  requirejs.config({
    //By default load any module IDs from baseUrl
    baseUrl: '',
    // paths config is relative to the baseUrl, and
    // never includes a ".js" extension 
    paths: {
      'small-blue-mod': './a-script'
    }
  });

  // Start the main app logic.
  requirejs(['small-blue-mod'], function (sbm) {
    alert(sbm.color);
  });
})();

***small-blue-mod.js

define({
   color: "blue",
   size: "small" 
});

*File System looks like...

index.html
main.js
require.js
FOLDER called "a-script"

a-script folder contains small-blue-mod.js

Upvotes: 0

Views: 51

Answers (1)

user3995789
user3995789

Reputation: 3460

The path small-blue-mod refers to the a-script folder, either require it like small-blue-mod/small-blue-mod or recommended change your path to this:

paths: {
  'small-blue-mod': './a-script/small-blue-mod'
}

Upvotes: 1

Related Questions