question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Cannot bundle Node.js built-in "node:http", due to node-fetch dep

See original GitHub issue

Qwik Version

v0.9.0

Operating System (or Browser)

OSX

Node Version (if applicable)

v16.3.0

Which component is affected?

Qwik Rollup / Vite plugin

Expected Behaviour

The preview command builds and previews the application

Actual Behaviour

The preview command fails with

[commonjs--resolver] Cannot bundle Node.js built-in "node:http" imported from "node_modules/node-fetch/src/index.js". Consider disabling ssr.noExternal or remove the built-in dependency.
error during build:
Error: Cannot bundle Node.js built-in "node:http" imported from "node_modules/node-fetch/src/index.js". Consider disabling ssr.noExternal or remove the built-in dependency.
    at error (file:///Users/yoroshi/projects/web/qwik-app/node_modules/rollup/dist/es/shared/rollup.js:1858:30)
    at throwPluginError (file:///Users/yoroshi/projects/web/qwik-app/node_modules/rollup/dist/es/shared/rollup.js:21781:12)
    at Object.error (file:///Users/yoroshi/projects/web/qwik-app/node_modules/rollup/dist/es/shared/rollup.js:22503:20)
    at Object.resolveId (file:///Users/yoroshi/projects/web/qwik-app/node_modules/vite/dist/node/chunks/dep-a713b95d.js:34356:34)
    at Object.handler (file:///Users/yoroshi/projects/web/qwik-app/node_modules/vite/dist/node/chunks/dep-a713b95d.js:45961:19)
    at file:///Users/yoroshi/projects/web/qwik-app/node_modules/rollup/dist/es/shared/rollup.js:22710:40

Occurs after Vite ✓ Built client modules

Additional Information

To reproduce simply create a new qwik app using the creator and add a integration with cloudflare-pages or netlify-edge

npm create qwik@latest
# Create basic
cd qwik-app
npm run qwik add cloudflare-pages # or netlify-edge
npm run preview

This only seems to effect the edge function integrations.

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
rafaelluciocommented, Sep 30, 2022

I had the same issue

The repo is here: https://github.com/gang-of-front/realworld-qwik

I changed vite.config.ts and add "type": "module" in package.json the preview works for me

// => vite.config.ts || noExternal: undefined

export default defineConfig(() => {
  return {
    ssr: { target: "webworker", noExternal: undefined },
    plugins: [qwikCity(), qwikVite(), tsconfigPaths()],
  };
});
{
  "name": "my-qwik-basic-starter",
  "description": "Recommended for your first Qwik app",
  "engines": {
    "node": ">=15.0.0"
  },
  "type": "module",
}
0reactions
adamdbradleycommented, Oct 31, 2022

Thanks for opening the issue. With how how the vite.config was being shared caused issues similar to this, which is why the latest updates recommends using the adaptors and vite configs specifically for each server. I verified the updates worked on the example repo from @rafaellucio.

  1. Update to the latest version of @builder.io/qwik and @builder.io/qwik-city
  2. Run npm run qwik add
  3. Add the “Adaptor” you’ll be using, such as “Adaptor: Cloudflare Pages (serverless)”
  4. A new vite config will be created: adaptors/cloudflare-pages/vite.config.ts
  5. Your package.json build.server will be updated to vite build -c adaptors/cloudflare-pages/vite.config.ts

Additionally, in the root vite.config.ts, you’ll be able to remove the ssr property, since it’s now included in the cloudflare specific vite config:

export default defineConfig(() => {
  return {
-    ssr: { target: "webworker", noExternal: true },
    plugins: [qwikCity(), qwikVite(), tsconfigPaths()],
  };
});

Hope that helps and please reopen a new issue if you’re still have troubles. Thanks

Read more comments on GitHub >

github_iconTop Results From Across the Web

Cannot bundle Node.js built-in "node:http" while vite build #1665
I am working on Vite v3.0.9 and using node-fetch 3.2.10. I used doc to import node-fetch (see screen) While build I have next...
Read more >
How do I resolve "Cannot find module" error using Node.js?
Using npm install installs the module into the current directory only (in a subdirectory called node_modules ). Is app.js located under ...
Read more >
Modules: Packages | Node.js v19.3.0 Documentation
It treats all files that lack .json or .node extensions as JavaScript text files. It cannot be used to load ECMAScript modules (although...
Read more >
node-fetch - npm
A light-weight module that brings Fetch API to node.js. Latest version: 3.3.0, last published: a month ago. Start using node-fetch in your ...
Read more >
fetch() In Node.js Core: Why You Should Care - Fusebit
What is fetch()?. Why should you care? How do you get it? Related Content. Request Fusebit Demo.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found