Browserifing Loopback's client

Question

I am trying to get this working: Running LoopBack in the browser

Whilst API works great, attempt to browserify the copy of file 'browser-app.js' throw an error:

Error: Cannot find module 'loopback-boot#instructions' from 'APP_DIR/node_modules/loopback-boot'

Update

The code:

client/js/app.js

var loopback = require('loopback');
var boot = require('loopback-boot');

var app = module.exports = loopback();
boot(app);

Browserifing:

browserify client/js/app.js -o client/js/bundle.js
Error: Cannot find module 'loopback-boot#instructions' from 'APP_DIR/node_modules/loopback-boot'
    at /opt/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:46:17
    at process (/opt/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:173:43)
    at ondir (/opt/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:188:17)
    at load (/opt/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:69:43)
    at onex (/opt/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:92:31)
    at /opt/local/lib/node_modules/browserify/node_modules/resolve/lib/async.js:22:47
    at FSReqWrap.oncomplete (fs.js:99:15)

I'd suggest showing the code you are using directly in the question, even if it's identical to docs. the strongloop docs seem to change often (and it would confirm that you're doing the same as in the docs) — Kevin B, Mar 20 '15 at 14:41
Thank you, Kevin. I've added the code and response of browserify to the question. — leitasat, Mar 20 '15 at 14:47
Are you using the latest version of loopback-boot? seems it was updated 22 hours ago, in particular the part that's failing for you. — Kevin B, Mar 20 '15 at 14:52
mine is 2.6.5 and `npm update` does nothing. Can OS affect that? — leitasat, Mar 20 '15 at 14:56
Is this related to your problem? seems somewhat similar. https://github.com/strongloop/loopback-boot/issues/53 — Kevin B, Mar 20 '15 at 14:56
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/73455/discussion-between-leitasat-and-kevin-b). — leitasat, Mar 21 '15 at 00:03

score 1 · Answer 1 · edited Aug 02 '17 at 10:49

I would suggest you take a look at this example: https://github.com/strongloop-community/loopback-example-isomorphic

The gulp task build:lb-client does the magic:

gulp.task('build:lb-client', ['clean'], function(done) {
  var b = browserify({basedir: path.resolve(__dirname, 'client/loopback')});
  b.require(path.resolve(__dirname, 'client/loopback/index.js'),
    {expose: 'lbclient'});
  try {
    boot.compileToBrowserify({appRootDir: path.resolve(__dirname,
      'client/loopback')}, b);
  } catch(e) {
    throw e;
  }

  var target = fs.createWriteStream('client/public/js/bundle.js');
  target
    .on('error', done)
    .on('close', done);
  b.bundle().pipe(target);
});

Run it with gulp build:lb-client and you'll find the file bundle.js inside the directory client/public/js/, the file is ready to be included in a web page.

Browserifing Loopback's client

1 Answers1