Modules using RequireJS is not exported properly

Question

I am currently developing a local JavaScript app that will help me to dynamically generate some managerial documents such as invoices and vouchers for unpaid services for a specific client.

I'll be using node_modules, and so far I am using (["jsonfile", "uniqid", "mkdirp"]) these modules need require to be stored in a variable.

The problem is that I am calling jsonfile as mention in its documentation

var jsonfile = require("jsonfile");

When console.log(jsonfile) from javascript file it returns function localRequire() unlike if i wrote that command inside browsers console .. for that it will return

>> console.log(jsonfile)
Object { spaces: null, readFile: readFile(), readFileSync: readFileSync(),     writeFile: writeFile(), writeFileSync: writeFileSync() } 
undefined

and to make the problem more complicated, when calling readFile() from console or from the script it returns that readFile() is not a defined function rather for jsonfile or fs which is a node module that is required for jsonfile

>>function readFile()
jsonfile.readFile()
TypeError: fs.readFile is not a function

I don't really know what is the difference and how to use that variable from console than the variable of script. Especially that I don't redefine it in console after running the app.

Some code snippets you may need:

I am calling two scripts in index.html:

<!--requirejs -->
<script data-main="app" src="node_modules/requirejs/require.js"></script>
<!-- a script which will use $ which is not defined -->
<script src="services/specifyDocType.js"></script>
<!--the script the call require and have the jsonfile variable -->
<script src="jsonfile-test.js"></script>

app.js code:

requirejs.config({
  //"baseUrl": "node_modules",
  "paths": {
    "app": "app",
    "jsonfile": "jsonfile/index",
    "graceful-fs": "jsonfile/node_modules/graceful-fs/graceful-fs",
    "fs": "/node_modules/jsonfile/node_modules/graceful-fs/fs",
    "jquery": "node_modules/jquery/dist/jquery.min"
    }
});

requirejs(["dist/js/main"]);

main.js :

define("jquery", function($) {
  $('body');
});

For the local script that will create jsonfile variable, here is the initial code I had to do the working test:

var data = 'DOCS/voucher/voucher.json';
var jsonfile = require(["node_modules/jsonfile/index"]);

console.log(jsonfile);
//this console that returns the function localRequire() mentioned above.

jsonfile.readFile(data, function(err, obj) {
    console.dir(obj);
});

For this app, I don't need to use a framework such as Angularjs, and I need to use require for each module I am using so far to create unique ids and directories in the root directory.

One more thing, this is my console on the first run:

function localRequire()  jsonfile-test.js:4:1
TypeError: jsonfile.readFile is not a function[Learn More]  jsonfile-test.js:6:1
ReferenceError: module is not defined[Learn More]  index.js:133:1
Error: Module name "fs" has not been loaded yet for context: _. Use require([]) http://requirejs.org/docs/errors.html#notloaded  require.js:168:17
Use of getPreventDefault() is deprecated.  Use defaultPrevented instead.

Answer 1

You seem to think that RequireJS is a drop-in replacement for Node's require call. It isn't.

Node supports the CommonJS module system. RequireJS supports the Asynchronous Module Definition (AMD) system. (See here for a question about the difference between the two.) It also provides support to facilitate consuming CommonJS modules, but it does not support consuming CommonJS modules as-is. At the very least, the CommonJS module must be wrapped in a define call. If you start with this CommonJS module, for instance:

function foo() {}

exports.foo = foo;

then you need at a minimum to convert it to this:

define(function (require, exports) {
  function foo() {}

  exports.foo = foo;
});

---

In addition, while RequireJS can consume CommonJS modules, it is not able to provide support for those modules that depend on the node VM. fs is one such module. It depends on the Node VM. It cannot be run in the browser. The DOM does not expose an API that the fs module could use to access the filesystem. jsonfile depends on fs so you cannot just load it with RequireJS in the browser. You could possibly find a module made to run in browsers that present an API compatible with fs and present a fake filesystem to the client code and this may work, but you have to do the job of finding the replacement module. RequireJS won't do this for you.