CODEWITHSUNDEEP
javascriptnode.jsbrowserify
megawac
megawac

Reputation: 11353

Browserify: override package and use different main file

Browserify's "browser" field in the package.json seems overloaded and I can't figure out a way to get around this issue

How would I shim several packages not necessary in the browser (such as ws and canvas) while also changing the "main" file for browserify's use

I was hoping something like this would work

{
    "browser": {
       "ws": "./src/browser/ws-shim",
       "main": "./src/BrowserVersion"
    }
}

src/browser/ws-shim

module.exports = global.WebSocket;

Repository in question has some specific Node functionality such as services over TCP and stream support which won't make sense in the browser. Meanwhile, we use node ports of several browser APIs to share code between the Node and Browserifyied versions of the lib

Upvotes: 1

Views: 1646

Answers (1)

Justin Howard
Justin Howard

Reputation: 5643

Use the browser key to map to your main file.

{
    "browser": "./src/browserIndex.js"
}

Then use the aliasify transform to map the rest of your dependencies.

{
    "browserify": {
        "transform": [ "aliasify" ]
    },
    "aliasify": {
        "aliases": {
            "ws": "./src/browser/ws-shim"
        }
    },
    "devDependencies": {
        "aliasify": "^1.4.0"
    }
}

Upvotes: 4

Related Questions