Skip to content

Empty module if dep is not optimized ahead of time #1949

@calebeby

Description

@calebeby
  • Read the docs.
  • Use Vite >=2.0. (1.x is no longer supported)
  • If the issue is related to 1.x -> 2.0 upgrade: no

Describe the bug

This is somewhere between a bug and a feature request/question:

I have a use case where I am using Vite via createServer, and the files that will be bundled are not known ahead of time (so the dependency pre-bundling won't/can't work).

Here's what I expect to happen:

  1. Start Vite server. It sees nothing to pre-bundle
  2. I ask Vite to transpile a file with any import to node_modules:
    import $ from 'jquery'
    console.log($)
  3. Vite sees that there is a non-pre-bundled import, and triggers a pre-bundle, in the meantime it should either respond with the transpiled file, or wait until the pre-bundle finishes before responding (I don't know if the ?v= param depends on the pre-bundle already existing
    Something like:
    import __vite__cjsImport0_jquery from "/node_modules/.vite/jquery.js?v=1d07b389"
    const $ = __vite__cjsImport0_jquery.__esModule ? __vite__cjsImport0_jquery.default : __vite__cjsImport0_jquery
    
    console.log('here is jquery:', $)
  4. Then I fetch the module /node_modules/.vite/jquery.js?v=1d07b389 and once Vite finishes bundling it Vite responds with it

Here's what currently happens:

On step 3 Vite responds with:

import $ from '/node_modules/jquery/dist/jquery.js'

console.log('here is jquery:', $)

And when I fetch /node_modules/jquery/dist/jquery.js Vite responds with an empty file and without a content-type so the module can't be executed.

Reproduction

You can see the bug here: https://github.com/calebeby/vite-bug

  1. npm i
  2. Clear node_modules/.vite if you ran it previously
  3. npm run dev
  4. Open a browser tab to http://localhost:3000/main.js (only to avoid CORS errors)
  5. In the browser console paste await import('http://localhost:3000/main.js')
  6. Problem: response for imported jquery is empty and doesn't have a content type

There is code in place that triggers a full-reload when a missing pre-bundled dep gets bundled, but what I am not understanding is why vite doesn't just wait to respond until the pre-bundled dep gets pre-bundled. I think WMR's npm middleware handles it closer to the way I expect

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions