solid-start icon indicating copy to clipboard operation
solid-start copied to clipboard

[Bug?]: `vinxi build` produces code that uses wrong APIs (import fetch from "node-fetch")

Open nbrugger-tgm opened this issue 1 year ago • 4 comments

Duplicates

  • [X] I have searched the existing issues

Latest version

  • [X] I have tested the latest version

Current behavior 😯

When importing and using APIs like import fetch from "node-fetch"; the types, and APIs that are used at runtime WILDLY differ between npm run dev and npm run build && node .output/server/index.mjs.

Observed differences:

  1. using await fetch(myUrl, { compress: false });
    • run dev: the response returned is as expected not decompressed when using .arrayBuffer()
    • run build: the response ignores the compress option and decompresses the response of .arrayBuffer()
  2. prototype of NodeJS.ReadableStream (console.log(await fetch(myUrl).body)
    • run dev
      PassThrough {
          _transform: [Function],
          .... many more props .....
          find: [Function],
      }
      
    • run build
      [ReadableStream] {
         locked: [Getter],
         cancel: [Function: cancel],
         getReader: [Function: getReader],
         pipeThrough: [Function: pipeThrough],
         pipeTo: [Function: pipeTo],
         tee: [Function: tee],
         values: [Function: values]
       }
      

In general it seems that at runtime (npm run build) import fetch from "node-fetch"; the fetch is replaced with the browser/DOM fetch API which does not happen at npm run dev.

Expected behavior 🤔

When importing import fetch from "node-fetch"; the output and behaviour of the API in npm run dev and npm run build is completely the same. While implementation might change behind the scene on building behaviour and API contracts shall not be broken.

Steps to reproduce 🕹

Steps:

  1. go to https://stackblitz.com/edit/github-qd1tfd?file=src%2Froutes%2Findex.ts
  2. Clone it to your laptop: the reproducer does not work on stackblitz since the app runs seemingly in a web-worker and seems NOT to use "real" node-apis
  3. run npm install && npm run dev goto localhost:3000 see the Content size + body prototype
  4. run npm run build && node .output/server/index.mjs repeat and see the difference

Context 🔦

There are features in the node-fetch fetch not present in the browser / dom fetch (the compress option).

Your environment 🌎

@solidjs/start: 1.0.9

(see the stackblitz from reproducer)

nbrugger-tgm avatar Oct 28 '24 13:10 nbrugger-tgm

I see.. I wonder if this was to try to homogenize all the fetch on the web version.. I don't think Start does this but Vinxi might be. Actually the fact this happens in build makes me possibly suspicious of Nitro here.

ryansolid avatar Oct 31 '24 21:10 ryansolid

To share some information to help trace this, it might be coming from unenv which Nitro uses. I've experienced similar behaviour in build.

You may consider doing this to circumvent the automatic replacement

export default defineConfig({
  server: {
    alias: {
      "node-fetch": "node-fetch",
    },
  },
});

ryoid avatar Nov 27 '24 12:11 ryoid

Where would I have to do this? vinxi.js? Vite plugin?

nbrugger-tgm avatar Nov 27 '24 13:11 nbrugger-tgm

Where would I have to do this? vinxi.js? Vite plugin?

In app.config.ts

ryoid avatar Nov 27 '24 14:11 ryoid