question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Should Brunch compile Node.js modules to AMD, Common.js, Node.js and Browser-compatible single file?

See original GitHub issue

We recently launched BackboneORM which needs to run in the Browser and in Node.js.

I modified Brunch’s module system in a way similar to how Superagent delivers a AMD, Common.js, Node.js and Browser-compatible single file. Basically, you would define a local module system and then expose the root symbol and its dependencies in multiple loader-compatibile formats:

if (typeof exports == 'object') {
  module.exports = require('backbone-orm/lib/index');
}
else if (typeof define == 'function' && define.amd) {
  define('backbone-orm', ['underscore', 'backbone', 'moment', 'inflection'], function(){return require('backbone-orm/lib/index'); });
}
else {
  window.bborm = require('backbone-orm/lib/index');
}

Also, I added a shim method so the bundle can load dependencies from AMD, Browserified, or pull things off of window when loading in the browser.

if window?
  require.shim([
    {symbol: '_', path: 'lodash', alias: 'underscore', optional: true}, {symbol: '_', path: 'underscore'}
    ...
   ])

Do achieve this, I combined a grunt script and Brunch config.

I think it would be reasonably simple to add some library building config options to Brunch; for example, listing AMD dependencies. What would you think about adding this support natively to Brunch?

Input: Many files including CoffeeScript which use of Common.js Output: AMD, Common.js, Node.js and Browser-compatible single file

Issue Analytics

  • State:closed
  • Created 10 years ago
  • Comments:19 (13 by maintainers)

github_iconTop GitHub Comments

2reactions
pjanikcommented, Apr 28, 2016

@pcattori, I’d rather look at babel compiler and/or webpack. If you publish your package to npm, you might not necessarily want to concatenate it into a single file - then use babel compiler directly just to translate it to ES5. Webpack can easily build UMD package that can be published too. I’ve switched to these tools and they seem to be really popular in React’s world.

1reaction
paulmillrcommented, Apr 28, 2016

yeah we’ll need to investigate different ways of solving this problem. i’ve meant that “AMD” and “browser-compatible” files are no longer really needed. Something to bundle it to one commonjs module would be useful.

Read more comments on GitHub >

github_iconTop Results From Across the Web

CommonJS vs. ES modules in Node.js - LogRocket Blog
Learn about the differences between CommonJS and ES modules when using them in Node.js applications to organize software code.
Read more >
CommonJS modules | Node.js v19.3.0 Documentation
CommonJS modules are the original way to package JavaScript code for Node.js. Node.js also supports the ECMAScript modules standard used by browsers and ......
Read more >
CommonJS vs ES Modules in Node.js - A Detailed Comparison
CommonJS modules are AMD-compliant and can be used in both Node.js and browsers. ES modules are not AMD-compliant but are supported in ...
Read more >
Is it possible to mix AMD and CommonJS modules within ...
is there a way to mix AMD and CommonJS modules in the same Typescript project (preferably using NodejsTools). Yes. Use grunt-ts .
Read more >
How to Create a Hybrid NPM Module for ESM and CommonJS.
Creating a single NPM module that works in all environments.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found