TypeError: bu.unmask is not a function

[i-am-the-slime]

After following the instructions for the react-ts boilerplate and doing
npm run dev the dev server crashes with this error after I click on "About":

/node_modules/vite/node_modules/ws/lib/buffer-util.js:118
      else bu.unmask(buffer, mask);
              ^
TypeError: bu.unmask is not a function

[brillout]

Let me have a look

[brillout]

I cannot reproduce; what's your Node.js version?

[i-am-the-slime]

v16.3.0 what's yours?

[brillout]

v15.14.0

[i-am-the-slime]

Just tried with that one and the result was the same:

~/code/ps-vite-ssr/ps-vite-ssr main ?1 ❯ nvm use 15                                                                               4s 15:58:47
Now using Node v15.14.0 (npm 7.7.6) ~/.local/share/nvm/v15.14.0/bin/node
~/code/ps-vite-ssr/ps-vite-ssr main ?1 ❯ npm run dev                                                                                 15:58:52

> dev
> npm run server


> server
> ts-node ./server

Server running at http://localhost:3000

/Users/mark/code/ps-vite-ssr/ps-vite-ssr/node_modules/vite/node_modules/ws/lib/buffer-util.js:118
      else bu.unmask(buffer, mask);
              ^
TypeError: bu.unmask is not a function
    at unmask (/Users/mark/code/ps-vite-ssr/ps-vite-ssr/node_modules/vite/node_modules/ws/lib/buffer-util.js:118:15)
    at Receiver$1.getData (/Users/mark/code/ps-vite-ssr/ps-vite-ssr/node_modules/vite/node_modules/ws/lib/receiver.js:415:25)
    at Receiver$1.startLoop (/Users/mark/code/ps-vite-ssr/ps-vite-ssr/node_modules/vite/node_modules/ws/lib/receiver.js:143:22)
    at Receiver$1._write (/Users/mark/code/ps-vite-ssr/ps-vite-ssr/node_modules/vite/node_modules/ws/lib/receiver.js:78:10)
    at writeOrBuffer (node:internal/streams/writable:395:12)
    at Receiver$1.Writable.write (node:internal/streams/writable:340:10)
    at Socket.socketOnData (/Users/mark/code/ps-vite-ssr/ps-vite-ssr/node_modules/vite/node_modules/ws/lib/websocket.js:908:35)
    at Socket.emit (node:events:369:20)
    at Socket.emit (node:domain:470:12)
    at addChunk (node:internal/streams/readable:313:12)

[brillout]

Maybe try to rm node_modules and re-install since you also changed the npm version

[brillout]

I actually don't have node_modules/vite/node_modules/ws

[brillout]

Something seems wrong with your setup because ws is a devDependency, see Vite's package.json

[i-am-the-slime]

Just tried from scratch again with the same result:

I don't have any devDependencies in package.json however

{
  "scripts": {
    "dev": "npm run server",
    "prod": "npm run build && npm run server:prod",
    "build": "vite build && vite build --ssr",
    "server": "ts-node ./server",
    "server:prod": "cross-env NODE_ENV=production ts-node ./server"
  },
  "dependencies": {
    "@types/express": "^4.17.12",
    "@types/node": "^15.12.1",
    "@types/react": "^17.0.9",
    "@types/react-dom": "^17.0.6",
    "@vitejs/plugin-react-refresh": "^1.3.3",
    "cross-env": "^7.0.3",
    "express": "^4.17.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "ts-node": "^9.1.1",
    "typescript": "^4.3.2",
    "vite": "^2.3.6",
    "vite-plugin-ssr": "^0.1.2"
  }
}

[brillout]

What does npm why ws say?

It's Vite that has ws as devDependency.

[i-am-the-slime]

Yeah, sorry I just reread.

~/code/ps-vite-ssr/vite-ssr-project main ?1 ❯ npm why ws                                                                          5s 16:10:14
npm ERR! No dependencies found matching ws

[brillout]

It's Vite that has ws as devDependency.

Which means you shouldn't have /node_modules/vite/node_modules/ws/ but you do.

[brillout]

So that's weird that you have node_modules/vite/node_modules/ws/lib/buffer-util.js:118 yet npm says that ws is not installed.

My npm version: 7.7.6.

[i-am-the-slime]

I don't actually have the folder node_modules/vite/node_modules but something seems to be requiring from there.

I have the same npm version.

[brillout]

I don't actually have the folder node_modules/vite/node_modules but something seems to be requiring from there.

That contradicts your error stack #107 (comment)

You can try yarn instead of npm

[i-am-the-slime]

Alright, I just had a hunch: It's the browser. It works fine in Chrome but not in Safari (v15)

Firefox is also fine.

[i-am-the-slime]

vitejs/vite#3977

This is the one. Thanks very much for the quick feedback and sorry for the confusion.

[brillout]

No worries :-).

Let me know how vite-plugin-ssr works out for you.