Improve the way library version made avail at run-time

[kilianm]

Inside a grunt+webpack based project I'm having issues building autobahnJS. The follow error occurs:

Module parse failed: /home/kilian/workspace/some-project/node_modules/autobahn/package.json Line 2: Unexpected token :
You may need an appropriate loader to handle this file type.
| {
|   "name": "autobahn",
|   "version": "0.9.5",
|   "description": "An implementation of The Web Application Messaging Protocol (WAMP).",
 @ ./~/autobahn/lib/autobahn.js 3:12-38

It seems that lib/autobahn.js uses require() to load a JSON file (for version information). Location: https://github.com/tavendo/AutobahnJS/blob/master/package/lib/autobahn.js#L17

I think requirejs can only load json appropriately using the text! and json! plugin (e.g. https://github.com/millermedeiros/requirejs-plugins ).

[oberstet]

AutobahnJS for use in browsers must be built with browserify.

[kilianm]

And now intention to support webpack? It's only this small version number which is breaking the build.

[oberstet]

No, sorry, we can't support alll build systems out there. You should use a pre-built AutobahnJS as input. This is how to use AutobahnJS with bower e.g.

[azazel75]

@kilianm, @oberstet Browserify sucks a bit, so i looked into this and found a solution:

• install autobahn and json-loader wih npm
• inside webpack.config.js add something like:

module: { loaders: [ { test: /autobahn\/package.json$/, loader: 'json-loader'} ] },

• forget browserify

[joshhornby]

@azazel75 Perfect! Thank you very much

[koliyo]

@azazel75 Thank you!

But autobahn should really be made webpack compatible by default

[adamjohnwright]

Thanks you azazel75 worked perfectly!!

[MichaelKetchel]

Have any of you guys figured out how to work around errors like this this:

[0] Module build failed: SyntaxError: Unexpected token m in JSON at position 0
[0]     at Object.parse (native)
[0]     at Object.module.exports (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/json-loader/index.js:7:48)
[0]  @ ./~/autobahn/lib/autobahn.js 17:12-38

If I comment out lines 17 and 40 in the autobahn.js file (yes, modifying libraries == bad) I get this fresh mess (I expect I'll get these even after the first is fixed):

[0] WARNING in ./~/bindings/bindings.js
[0] Critical dependencies:
[0] 76:22-40 the request of a dependency is an expression
[0] 76:43-53 the request of a dependency is an expression
[0]  @ ./~/bindings/bindings.js 76:22-40 76:43-53
[0]
[0] WARNING in ./~/bindings/README.md
[0] Module parse failed: /home/michael/Projects/company/react-redux-universal-hot-example/node_modules/bindings/README.md Unexpected token (2:3)
[0] You may need an appropriate loader to handle this file type.
[0] SyntaxError: Unexpected token (2:3)
[0]     at Parser.pp.raise (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:920:13)
[0]     at Parser.pp.unexpected (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:1483:8)
[0]     at Parser.pp.parseExprAtom (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:330:12)
[0]     at Parser.pp.parseExprSubscripts (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:225:19)
[0]     at Parser.pp.parseMaybeUnary (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:204:17)
[0]     at Parser.pp.parseExprOp (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:171:41)
[0]     at Parser.pp.parseExprOp (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:173:19)
[0]     at Parser.pp.parseExprOps (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:153:15)
[0]     at Parser.pp.parseMaybeConditional (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:133:19)
[0]     at Parser.pp.parseMaybeAssign (/home/michael/Projects/company/react-redux-universal-hot-example/node_modules/acorn/dist/acorn.js:110:19)
[0]  @ ./~/bindings ^\.\/.*$
[0] webpack built d38a0872678fd64ae2d1 in 10582ms

I seriously just want to use Autobahn|JS in my ReactJS application. Preferably without this "bindings" junk. The way my build chain is set up, I can't really just link in plain js files in the way traditional to web pages. Rewriting my Crossbar-based backend is NOT desirable at this point, but beginning to look like my only practical option.

[jrudio]

@MichaelKetchel I didn't get the first error you got, but I encountered the bindings one. The fix for me came from this link.

I added this to the webpack plugin array and worked perfectly for me:

plugins: [
    new webpack.ContextReplacementPlugin(/bindings$/, /^$/)
]

[alexey2baranov]

+1 As written hire https://bugs.jqueryui.com/ticket/15015 jQueryUI won't work with browserify and works fine with webpack. So we are waiting for autobahn|js-webpack release

[oberstet]

Ok, reopening as it seems to affect quite some people.

As @kilianm figured, the offending stuff is really just to make the library version available at run-time without requiring to maintain the version number at 2 places (in the package.json and in the code).

Any ideas?

[glortho]

this is the solution that worked for us: https://github.com/crossbario/autobahn-js/issues/223#issuecomment-260428645

[Bigpet]

I basically had to patch autobahn to get it to work for me.

I use it in an ionic app and it uses webpack. I can't easily customize the webpack config as the "proper workaround" mentioned by @glortho would suggest.

I would love for the .json require/include to be gone.

[oberstet]

package.json is read via require to expose the library version at run-time:

https://github.com/crossbario/autobahn-js/blob/92a2e0dc9d9d918ee45b9e097cfb16550226932c/lib/autobahn.js#L45

oberstet@intel-nuci7:~/scm/crossbario/autobahn-js$ find lib -type f -exec grep -Hi "require" {} \; | grep package
lib/autobahn.js:var pjson = require('../package.json');
oberstet@intel-nuci7:~/scm/crossbario/autobahn-js$ find lib -type f -exec grep -Hi "pjson" {} \; 
lib/autobahn.js:var pjson = require('../package.json');
lib/autobahn.js:exports.version = pjson.version;

if anyone comes up with a different approach that achieves the same (without manually editing the version in the source file), cool!

[oberstet]

Changing the title from "Grunt doesn't like require("../package.json") ... which technically is true, but not pointing to the actual goal (so we can drop reading package.json - maybe) ..