Getting Uncaught TypeError: fs.readdirSync is not a function when using Browserify with Nutritionix NodeJS client library

Question

I'm trying to build a demo app using Node and I keep getting Uncaught TypeError: fs.readdirSync is not a function error when trying to use the Nutrionix NodeJS Client Library (https://github.com/nutritionix/nodejs-client-library) and Browserify.

I'm following this tutorial http://www.sitepoint.com/getting-started-browserify/ up to the Using the Browserify Output section but instead of of using Underscore and the code provided for main.js, I'm using the Nutritionix NodeJS client library and the following code in main.js:

var NutritionixClient = require('nutritionix');

var nutritionix = new NutritionixClient({
    appId: '7c710fbd',
    appKey: 'a2f106128aa4b2ab81fd783fca5bf0ee'
    // debug: true, // defaults to false
});

My HTML using Jade is the following:

doctype html
html
  head
    title= title
    link(rel='stylesheet', href='/stylesheets/style.css')
  body
    block content
    script(src='javascripts/nutri.js')
    script(src='javascripts/main.js')

I use the following in the command line to build a new JavaScript file with the Nutritionix:

browserify public/javascripts/main.js -o public/javascripts/nutri.js

When I run this locally, in the console, I get Uncaught TypeError: fs.readdirSync is not a function in line 465 of nutri.js, which is the file made by Browserify. That line is fourth line in the following function:

function readDirp(path, excludeList) {
    var lib = {};
    var expand = new Expander(path);
    var files = fs.readdirSync(path).map(expand);

    files.forEach(function(file){
        if (excluded(file.name, excludeList) === false) {
            lib[file.name.split('.').shift()] = require(file.location);
        }
    });

    return lib;
}

I'm not sure why I keep getting this error. When I go through the Browserify tutorial which I linked at the top, I have no problem getting the Browserified file to work. Please let me know if more information is needed from me and any help is greatly appreciated.

Solution 1

Use brfs , https://github.com/browserify/brfs

fs.readFileSync() and fs.readFile() static asset browserify transform

This module is a plugin for browserify to parse the AST for fs.readFileSync() calls so that you can inline file contents into your bundles.

Even though this module is intended for use with browserify, nothing about it is particularly specific to browserify so it should be generally useful in other projects.

Solution 2

fs is a low-level API for filesystem operations, you can't browserifiy it just like that. You have to provide a replacement, this for example: https://github.com/mafintosh/browserify-fs. Since you can't access the client's filesystem from the browser, browserify-fs uses LevelDB to emulate a filesystem.

Comments

[alejandroj1234]

I followed what the browserify-fs README said. I installed browserify-fs using npm install browserify-fs and found in nutri.js where var fs = require('fs'); and replaced it with var fs = require('browserify-fs');. But when I start my app locally I get Uncaught Error: Cannot find module 'browserify-fs' on the first line of nutri.js

[user2677034]

However it inlines the file contents into your bundle so it may have unintentional results...