Occasionally, we need to use a JS library in our browser side, yet it's only available from the NPM repository.
As usual, the Google result of any NPM related questions will bring you more yes-and-no answers, and leave you in further confusions and headaches.
Well, life better be simpler 🙂
Say, we are going to use the NPM library of email-js-mime-parser and buffer in the browser, all we need to do is:
- install browserify tool
npm install -g browserify
- install npm libraries
npm install emailjs-mime-parser
npm install buffer
- create a new JS file, main.js
1 2 3 4 |
var parse = require('emailjs-mime-parser').default var Buffer = require('buffer').Buffer global.window.parseEmail = parse global.window.Buffer = Buffer |
- compile the main.js:
browserify main.js -o bundle.js
- use bundle.js in normal webpage, and you could use parseEmail and Buffer in the browser side JS:
1 2 3 4 5 6 7 8 9 |
<head> <script src='bundle.js'> <script> console.log(window.parseEmail); console.log(window.Buffer); </script> </html> |
(Note that default is needed for emailjs-mime-parser because of legacy export syntax.)
And that's all
Leave a comment