node-pbac icon indicating copy to clipboard operation
node-pbac copied to clipboard

Browser build

Open jdiamond opened this issue 7 years ago • 4 comments
trafficstars

Hi,

I'm looking to evaluate policies in the browser and had a hard time bundling pbac.js so it could run there. I made some minor changes to the project to make that work. Your unit tests made it really easy to catch all my mistakes (I hope!).

Instead of require'ing both lodash and lodash/fp, I switched to only using lodash/fp. When you include both lodash.js and lodash.fp.js in a browser, the FP build replaces the non-FP build. By only using one of those packages, it's much easier to manage.

I also only require lodash/fp instead of all the separate sub-modules to make it easier to externalize. Even when requiring separate packages, the bundle webpack was creating was over 200K with all the lodash dependencies. I understand there are ways to configure webpack to do "tree shaking", but I don't know how to do that yet.

I replaced the ipcheck package with ipaddr.js. ipcheck depended on the Node.js net module which made it unusable in the browser.

I added a variable (process.env.BROWSER) to do conditional compilation so I could avoid referencing the Buffer class in the browser build. I don't plan on using any binary attributes, but the references to Buffer added over 40K to the bundle so I compiled them out. I tried using Uint8Array to fulfill what Buffer was doing.

I removed the usage of util.format. The shim webpack bundled for that had a dependency on Buffer.

After all my changes, the pbac.js build is only 8K.

I added some new scripts to package.json to build the bundle. It writes to the dist folder, but that's ignored by Git. I included it in the npm package, though, so the unpkg CDN can find the build and make it available to browsers.

I added a separate script to run the tests with BROWSER set. The tests are still running in Node.js, but the BROWSER variable makes them exercise my alternate paths. Mocha can run in browsers, too, but I didn't try to get that to work.

I also added my webpack configuration file and a very simple example using it in the browser. You need to run the build before that will work and you need to install webpack and the other new dependencies before that:

npm install
npm run build
open browser/example.html

I hope these changes are OK. Let me know if you want me to make any updates. Thanks.

jdiamond avatar Apr 04 '18 00:04 jdiamond

I think Node 4 doesn't like the destructuring assignment. Do you want me to fix that? Node 4 goes end-of-life at the end of this month.

jdiamond avatar Apr 04 '18 00:04 jdiamond

@monken Now that you have dropped support for Node 4, would you consider merging this PR? I would like to use this project in the browser as well.

Thanks!

jayhogan avatar Nov 06 '18 21:11 jayhogan

@monken Any reason this was never merged?

gajus avatar Aug 04 '19 12:08 gajus

@monken any update on this?

AliYusuf95 avatar Jul 06 '20 15:07 AliYusuf95