---
source: https://iinventedlight.com/library/notes/vite-static-assets.md
title: "Importing a static asset in Vite returns its resolved public URL"
license: CC-BY-4.0
license_url: https://creativecommons.org/licenses/by/4.0/
source_license: "MIT (vitejs/vite docs and source); prose restates cited source lines in own words"
license_family: vite-mit
attribution: "Summary by iinventedlight (AI-assisted). Sources: Vite docs and Vite source (vitejs/vite), MIT. Notices: Vite documentation and source (vitejs/vite): Copyright (c) 2019-present, VoidZero Inc. and Vite contributors; MIT (https://raw.githubusercontent.com/vitejs/vite/main/LICENSE)."
author: "iinventedlight (synthesis of cited sources); text drafted with AI assistance"
date: 2026-11-11
status: published
approved_by: "Cole Withington, 2026-11-11 09:59 PT, Librarian chat widget t34s5: \"Yes, publish all 25 Angular and Vite drafts\""
checked_on: 2026-11-11
as_of: 2026-11-11
confidence: medium
untested: "No project was run for this note; only the fetched documentation and source files were read."
category: coding-references
topic_area: "code-web: Vite static assets"
tags: [vite, assets, url, build]
client: Librarian
sources:
  - id: S1
    title: "Static Asset Handling"
    publisher: Vite docs
    url: https://vite.dev/guide/assets
    accessed: 2026-11-11
    license: "MIT"
  - id: S2
    title: "asset plugin"
    publisher: Vite source
    url: https://github.com/vitejs/vite/blob/main/packages/vite/src/node/plugins/asset.ts
    accessed: 2026-11-11
    license: "MIT"
---
# Vite turns static asset imports into resolved public URLs

**Answer:** Importing a static asset returns the resolved public URL when the asset is served. In development, imgUrl will be /src/img.png. In the production build, imgUrl can become /assets/img.2d8efhg.png.

`url()` references in CSS are handled the same way. Common image, media, and font file types are detected as assets automatically. You can extend that list with the `assetsInclude` option. Referenced assets join the build assets graph, get hashed file names, and can be processed by plugins. Assets smaller than `assetsInlineLimit` are inlined as base64 data URLs.

TypeScript does not, by default, treat static asset imports as valid modules. Include `vite/client` to fix that. You can also import a file as a raw string with a `?raw` query.

## In source

The `vite:asset` plugin implements this behavior. It also supports loading plain strings with `import text from './foo.txt?raw'`. A resolved asset may be an inlined `data:` URL or a reference that later becomes a file URL token.

## See also

- [vite-production-build](https://iinventedlight.com/library/notes/vite-production-build/)
- [vite-plugins](https://iinventedlight.com/library/notes/vite-plugins/)

## Claims

- id: C1
  claim: Importing a static asset returns its resolved public URL.
  source: S1
  evidence: "Importing a static asset will return the resolved public URL when it is served:"

- id: C2
  claim: Small assets can be inlined as base64 data URLs.
  source: S1
  evidence: "will be inlined as base64 data URLs."

- id: C3
  claim: The asset plugin supports raw string imports with ?raw.
  source: S2
  evidence: "Also supports loading plain strings with import text from './foo.txt?raw'"

- id: C4
  claim: The plugin is named vite:asset.
  source: S2
  evidence: "name: 'vite:asset',"

## Sources

- [S1] Static Asset Handling. Vite docs. https://vite.dev/guide/assets . License: MIT. Accessed 2026-11-11.

- [S2] asset plugin. Vite source. https://github.com/vitejs/vite/blob/main/packages/vite/src/node/plugins/asset.ts . License: MIT. Accessed 2026-11-11.


License: this note is CC BY 4.0 (https://creativecommons.org/licenses/by/4.0/). Summary by iinventedlight (AI-assisted). Sources and notices: Vite documentation and source (vitejs/vite): Copyright (c) 2019-present, VoidZero Inc. and Vite contributors; MIT (https://raw.githubusercontent.com/vitejs/vite/main/LICENSE). Text was condensed and changed from the originals.

---

Agents: [/agents.md](/agents.md) | [/.well-known/agent-library.json](/.well-known/agent-library.json).