Dep Optimization cann't work with import.meta.url asset

[dabuside]

Describe the bug

I have a npm package with static asset using new URL('img', import.meta.url) to reference.
npm package structure

@dabuside/test-import-meta-asset/
├─ logo.svg
├─ index.js  

index.js

const img = new URL('./logo.svg', import.meta.url);
export default img;

Vite prebuild the dependency into .vite/ folder, without moving asset into it.
Running dev mode, javascript file was loaded from .vite/ folder, static asset also loaded from .vite/, which is incorrect.
I should always configure optimizeDeps.exclude to prevent prebuild those assets, which is annoying.

Reproduction

https://stackblitz.com/edit/vitejs-vite-sef4ob?file=main.js&terminal=dev

Steps to reproduce

1. Open the link, you should see a broken image.
2. Run vite build && vite preview, you shoule see 2 vite logo works as expected.

dev mode

preview mode

System Info

System:
    OS: Windows 10 10.0.17763
    CPU: (4) x64 Intel(R) Core(TM)2 Duo CPU     T7700  @ 2.40GHz
    Memory: 1.58 GB / 8.00 GB
  Binaries:
    Node: 16.13.1 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.17 - C:\Program Files\nodejs\yarn.CMD
    npm: 8.1.2 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 107.0.5304.121
    Internet Explorer: 11.0.17763.1

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[luo3house]

It seems Vite may not be clear whether the optimized module needs some assets to import.

But explicitly import keyword can be recognized. Then the asset path is redirected back to node_modules.

import img from './logo.svg';

be optimized as follows:

import img from "/home/projects/vitejs-vite-tvn831/node_modules/@dabuside/test-import-meta-asset/logo.svg";

vite build works is because Deps optimization is enabled by default in dev only.

[dabuside]

It seems Vite may not be clear whether the optimized module needs some assets to import.

But explicitly import keyword can be recognized. Then the asset path is redirected back to node_modules.

import img from './logo.svg';

be optimized as follows:

import img from "/home/projects/vitejs-vite-tvn831/node_modules/@dabuside/test-import-meta-asset/logo.svg";

vite build works is because Deps optimization is enabled by default in dev only.

I can't explicitly import assets. Because I'm shipping an npm package with a lot of static asset. (eg, vue component with background image, map with on demand load geojson)

[sapphi-red]

Duplicate of #8427