Support vite-plugin-ssr

[brillout]

What version of Bun is running?

0.7.0

What platform is your computer?

Linux 4.14.254-20323-gc32c2d54e434 x86_64 unknown

What steps can reproduce the bug?

https://github.com/brillout/bun-vps

What is the expected behavior?

No response

What do you see instead?

No response

Additional information

No response

[iMrDJAi]

I have installed the latest revision of VPS and the patch has fixed the caller.getFileName() error as expected, and the server starts normally but crashes due to error: script "server" exited with code 11 (SIGSEGV) when attempting to access it.

$ NODE_ENV=production bun dist/server/index.mjs
[0.04ms] ".env"
START
DB DONE
[Function: getCountries]
NEXT
Server running at http://0.0.0.0:3000
error: script "server" exited with code 11 (SIGSEGV)

Also, what I have noticed is that in dev the .env values starting with a hash # gets ignored, that means all my color codes are invalid now:

PRIMARY_COLOR='#3C873A'
SECONDARY_COLOR='#777777'

const { PRIMARY_COLOR, SECONDARY_COLOR } = process.env
console.log('colors', { PRIMARY_COLOR, SECONDARY_COLOR })
// colors { PRIMARY_COLOR: '', SECONDARY_COLOR: '' }

Update: fixed by #3716.

I'll keep investigating for now.

[iMrDJAi]

I started thinking that it's all caused by fetch(). Not sure how does it actually work in bun. In dev, native fetch is undefined, in prod it's defined. Since node 14 I've been using this code to provide a global fetch function:

import fetch, { Headers, Request, Response } from 'cross-fetch'

// For node < 16
if (!global.fetch) { // Problematic code?
  global.fetch = fetch
  global.Headers = Headers
  global.Request = Request
  global.Response = Response
}

No matter if the code inside the if statement gets executed or not, removing it causes the error: script "server" exited with code 11 (SIGSEGV) error to disappear, which is weird. 😵‍💫

Btw, native fetch doesn't support Response.headers.raw(), which is something that my app relies on, I'll try to fix it and see how things go.

Update: or maybe it has nothing to do with fetch, the error seems to be random at this point...

Update 2: In dev, it seems like I've been using node instead of bun by mistake. I've been running the bun run ./node_modules/.bin/vavite dev command, but the correct one is supposed to be bun --bun vavite dev.

[iMrDJAi]

@brillout So, error: script "dev" exited with code 11 (SIGSEGV) is random, and I have no idea how to reproduce it. Sometimes it happens, sometimes it doesn't.

Let's skip this for now, as it is bun related. There are new errors related to VPS:

10:39:45 AM [vite-plugin-ssr][request(25)][Error] An error was thrown:
90 |             filePath = (0, utils_1.toPosixPath)(res(clientEntry.replace('@@vite-plugin-ssr/dist/esm/client/', '../../../client/').replace('.js', '.ts')));
91 |         }
92 |         catch {
93 |             // For users
94 |             // [RELATIVE_PATH_FROM_DIST] Current file: node_modules/vite-plugin-ssr/dist/cjs/node/runtime/html/injectAssets.js
95 |             filePath = (0, utils_1.toPosixPath)(res(clientEntry.replace('@@vite-plugin-ssr/dist/esm/client/', '../../../../../dist/esm/client/')));
                                                                                                                                                    ^
TypeError: undefined is not an object
      at <project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage/getPageAssets.js:95:145

 5 | function createErrorWithCleanStackTrace(errorMessage, numberOfStackTraceLinesToRemove) {
 6 |     let err;
 7 |     {
 8 |         var stackTraceLimit__original = Error.stackTraceLimit;
 9 |         Error.stackTraceLimit = Infinity;
10 |         err = new Error(errorMessage);
                  ^
error: [vite-plugin-ssr@0.4.133][Bug] You stumbled upon a bug in vite-plugin-ssr's source code. Go to https://github.com/brillout/vite-plugin-ssr/issues/new and copy-paste this error; a maintainer will fix the bug (usually under 24 hours).
      at createErrorWithCleanStackTrace (<project>/node_modules/vite-plugin-ssr/dist/cjs/utils/createErrorWithCleanStackTrace.js:10:14)
      at assert (<project>/node_modules/vite-plugin-ssr/dist/cjs/utils/assert.js:45:10)
      at getCategory (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/plugin/shared/loggerNotProd.js:216:12)
      at logRuntimeInfo (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/plugin/shared/loggerNotProd.js:31:21)
      at logHttpRequest (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage.js:175:4)
      at <project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage.js:48:4
      at renderPage (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage.js:37:26)
      at handle (<project>/node_modules/express/lib/router/layer.js:95:4)
      at next (<project>/node_modules/express/lib/router/route.js:137:6)
      at dispatch (<project>/node_modules/express/lib/router/route.js:112:2)
      at handle (<project>/node_modules/express/lib/router/layer.js:95:4)
      at <project>/node_modules/express/lib/router/index.js:281:15
      at param (<project>/node_modules/express/lib/router/index.js:360:13)
      at param (<project>/node_modules/express/lib/router/index.js:371:13)
      at process_params (<project>/node_modules/express/lib/router/index.js:416:2)
      at next (<project>/node_modules/express/lib/router/index.js:275:4)
      at <project>/node_modules/express/lib/router/index.js:641:11
      at next (<project>/node_modules/express/lib/router/index.js:260:13)
      at handle (<project>/node_modules/express/lib/router/index.js:174:2)
      at router (<project>/node_modules/express/lib/router/index.js:47:4)
      at handle (<project>/node_modules/express/lib/router/layer.js:95:4)
      at trim_prefix (<project>/node_modules/express/lib/router/index.js:323:6)
      at <project>/node_modules/express/lib/router/index.js:284:6
      at process_params (<project>/node_modules/express/lib/router/index.js:341:11)
      at next (<project>/node_modules/express/lib/router/index.js:275:4)
      at <project>/node_modules/express/lib/router/index.js:641:11

[iMrDJAi]

Also in prod, I got that error:

TypeError: undefined is not a function (near '...jsxDEV...')
    at <anonymous> (<project>/dist/server/entries/renderer_default-page-server.mjs:158:16)
    at render (<project>/dist/server/entries/renderer_default-page-server.mjs:144:22)
    at <anonymous> (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage/executeOnRenderHtmlHook.js:19:5)
    at <anonymous> (<project>/node_modules/vite-plugin-ssr/dist/cjs/utils/executeHook.js:44:23)
    at <anonymous> (<project>/node_modules/vite-plugin-ssr/dist/cjs/utils/executeHook.js:42:12)
    at executeHook (<project>/node_modules/vite-plugin-ssr/dist/cjs/utils/executeHook.js:53:11)
    at <anonymous> (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage/executeOnRenderHtmlHook.js:18:31)
    at executeOnRenderHtmlHook (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage/executeOnRenderHtmlHook.js:12:36)
    at <anonymous> (<project>/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage/renderPageAlreadyRouted.js:65:40)

Code:

import { jsxDEV } from "react/jsx-dev-runtime.js";
// ...
const pageHtml = ReactDOMServer.renderToString(
  /* @__PURE__ */ jsxDEV(App, { pageContext }, void 0, false, {
    fileName: "<project>/renderer/_default.page.server.tsx",
    lineNumber: 61,
    columnNumber: 5
  }, this)
);

jsxDEV() is undefined somehow. Also, isn't it supposed to be jsx() in prod instead?

[Jarred-Sumner]

I suspect the segfault (SIGSEGV) is an ESM <> CJS bug which @paperdave will fix this week. It is likely #3773. #3732 might fix it, but that PR still has some work to do before it can merge

jsxDEV() is undefined somehow. Also, isn't it supposed to be jsx() in prod instead?

I think NODE_ENV is being inlined when it shouldn't. If you explicitly set NODE_ENV to "development" or "production" , does that work around this issue? Bun needs to stop inlining NODE_ENV I think

[iMrDJAi]

I think NODE_ENV is being inlined when it shouldn't. If you explicitly set NODE_ENV to "development" or "production", does that work around this issue? Bun needs to stop inlining NODE_ENV I think

@Jarred-Sumner Alright, setting NODE_ENV to "production" in build command (NODE_ENV=production bun --bun vavite) has fixed the issue, JSX calls are now jsx() as expected.

I think the reason why jsxDEV() was undefined in prod is the fact that NODE_ENV was set to "production".

[brillout]

error: [vite-plugin-ssr@0.4.133][Bug] You stumbled upon a bug in vite-plugin-ssr's source code. Go to https://github.com/brillout/vite-plugin-ssr/issues/new and copy-paste this error; a maintainer will fix the bug (usually under 24 hours).
at createErrorWithCleanStackTrace (/node_modules/vite-plugin-ssr/dist/cjs/utils/createErrorWithCleanStackTrace.js:10:14)
at assert (/node_modules/vite-plugin-ssr/dist/cjs/utils/assert.js:45:10)
at getCategory (/node_modules/vite-plugin-ssr/dist/cjs/node/plugin/shared/loggerNotProd.js:216:12)

It seems like an issue with Bun's support for async hooks. You can disable VPS's use of async hooks by returning null in getHttpRequestAsyncStore() at vite-plugin-ssr/node/plugin/shared/getHttpRequestAsyncStore.ts.

[brillout]

On a tangent: Vite runs the CI of its ecosystem upon such comment. I can see such ecosystem CI to eventually be very helpful for Bun as well. This has significantly increased the trust between Vite and its ecosystem. By a matter a fact, Vite hasn't broken vite-plugin-ssr without us knowing it beforehand.

[timnghg]

I am developing elysia-vite-plugin for Elysia + vite-plugin-ssr.

Stumble upon same issue. I hope it is resolved soon. Glad to see @Jarred-Sumner and @brillout here, thank you very much for both of your awesome jobs.

[brillout]

There is a workaround for the issue you linked to on the dev branch which I'll release this week. Although you'd still hit the issues mentioned by @iMrDJAi then, which vite-plugin-ssr cannot work around.

thank you very much for both of your awesome jobs.

👍 Looking forward to release the v1 for a flexible, performant, feature-complete, simple, and easy (with the vike-{react,vue,solid} integrators) tool.

I am developing elysia-vite-plugin for Elysia + vite-plugin-ssr.

Don't hesitate to reach out if you run into any issue. And, if you don't use it already, I recommend the v1 design as it unlocks new capabilities.

[brillout]

@iMrDJAi FYI Tim did a PR vikejs/vike#1048 which is released as 0.4.134-commit-fc71d1f.

[paperdave]

i checked that pr and the change made there is a workaround for a known bug we have in bun with require.resolve. We'll have to fix it eventually for this issue #3937, but since vite-plugin-ssr fixed their usage of it, i think we can close this tracking issue.

If you run into future issues with vite-plugin-ssr or other packages, please submit more issues.

[Jarred-Sumner]

The require.resolve workaround should no longer be necessary as of Bun v0.7.4

[brillout]

Wonderful 💯.

Opened a ticket for tracking Linux 4 support: #4040.