How to use npm installed requireJS for browser

Question 1

How to use npm installed requireJS for browser

javascript npm requirejs

user2829759 · Feb 15, 2016 · Viewed 15.9k times · Source

Answer

Answer

It looks like you are conflating a bunch of different uses of RequireJS:

How can you use a RequireJS installed through Node in the browser?

You can just install it with npm install requirejs, and then you have your HTML file have a script element that points to node_modules/requirejs/require.js. Exactly as you show in your code snippet. That's all there is to it. This being said, I don't like to have node_modules in what I deploy, so I typically have my build process copy require.js elsewhere.
How can you load npm-installed modules with RequireJS in Node?

Suppose without RequireJS you would load the module foo by doing require('foo'). You install RequireJS and load it as requirejs. How do you load foo using RequireJS? You can just do requirejs('foo'). So long as RequireJS does not find it through its own configuration, it will issue as a last resort a call to Node's own require, and will load it this way? Here's an illustration. Install RequireJS with npm install requirejs. Create this file:
```
var requirejs = require("requirejs");

var fs = requirejs("fs");
console.log(fs);
```
Then run it. You'll get on the console Node's fs module.
How can you load npm-installed modules with RequireJS in a browser?

It depends on the modules. RequireJS does not contain code that will magically make a npm-installed module work in the browser. It ultimately depends on how the modules are structured. Some cases:

A. Some npm-installed modules can be loaded with RequireJS without modification. There's one library I've authored which is distributed through npm and yet is a collection of AMD modules. It is trivial to load them with RequireJS in the browser.

B. It may require being wrapped in define calls. I've recently loaded merge-options in one of my projects with gulp-wrap-amd. merge-options is a CommonJS module. It does not support RequireJS out-of-the-box but if you wrap it with a define call, it will work.

C. It may require something more complex before it will be loaded in a browser. For instance, if a module relies on Node's fs module, you'll have to provide a replacement for fs that runs in a browser. It will presumably present a fake filesystem to your code.

Question 2

While requirejs is capable of using npm-installed modules, how do I use requirejs in first place if itself is installed via npm install requirejs?

I have read examples of using requirejs listed in the example-section. They all seems to assume require.js is downloaded into a specific location. Since the documentation specifically said

do not do something like require("./node_modules/foo/foo").

I guess it is not right to put in index.html something like:

<html>
    <head>
        <script data-main="scripts" src="node_modules/requirejs/require.js"></script>
    </head>
    <body>
        <h1>Hello World</h1>
    </body>
</html>

What is the recommended way to use requirejs if it is npm-installed? If I missed something from the documentation please let me know. Thank you

How to use npm installed requireJS for browser

Answer

Related questions