服务时引入一个静态资源会返回解析后的公共路径：
jsimport imgUrl from './img.png'document.getElementById('hero-img').src = imgUrl例如，imgUrl 在开发时会是 /img.png，在生产构建后会是 /assets/img.2d8efhg.png。
行为类似于 Webpack 的 file-loader。区别在于导入既可以使用绝对公共路径（基于开发期间的项目根路径），也可以使用相对路径。
url() 在 CSS 中的引用也以同样的方式处理。
如果 Vite 使用了 Vue 插件，Vue SFC 模板中的资源引用都将自动转换为导入。
常见的图像、媒体和字体文件类型被自动检测为资源。你可以使用 assetsInclude 选项 扩展内部列表。
引用的资源作为构建资源图的一部分包括在内，将生成散列文件名，并可以由插件进行处理以进行优化。
较小的资源体积小于 assetsInlineLimit 选项值 则会被内联为 base64 data URL。
Git LFS 占位符会自动排除在内联之外，因为它们不包含它们所表示的文件的内容。要获得内联，请确保在构建之前通过 Git LFS 下载文件内容。
默认情况下，TypeScript 不会将静态资源导入视为有效的模块。要解决这个问题，需要添加 vite/client。
通过 url() 内联 SVG
当在 JS 中手动构造 url() 并传入一个 SVG 的 URL 时，应该用双引号将变量包裹起来。
jsimport imgUrl from './img.svg'document.getElementById('hero-img').style.background = `url("${imgUrl}")`显式 URL 引入 未被包含在内部列表或 assetsInclude 中的资源，可以使用 ?url 后缀显式导入为一个 URL。这十分有用，例如，要导入 Houdini Paint Worklets 时：
jsimport workletURL from 'extra-scalloped-border/worklet.js?url'CSS.paintWorklet.addModule(workletURL)显式内联处理 可以分别使用?inline或?no-inline后缀，明确导入带内联或不带内联的静态资源。
jsimport imgUrl1 from './img.svg?no-inline'import imgUrl2 from './img.png?inline'将资源引入为字符串 资源可以使用 ?raw 后缀