javascript - How to use npm installed requireJS for browser

Question

Welcome To Ask or Share your Answers For Others

javascript - How to use npm installed requireJS for browser

posted Oct 24, 2021 in Technique[技术] by 深蓝 (71.8m points)

javascript - How to use npm installed requireJS for browser

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

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…

1 Reply

深蓝 · Answer 1 · 2021-10-23T17:53:31+0000

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.

Categories

javascript - How to use npm installed requireJS for browser

javascript - How to use npm installed requireJS for browser

Please log in or register to add a comment.

Please log in or register to reply this article.

1 Reply

Please log in or register to add a comment.

Just Browsing Browsing

Most popular tags