Describe the bug
Disclaimer: I formatted this with an LLM.
My library inlines an HTML template and some SVG icons as strings with ?raw:
import svg from "./x.svg?raw";
vp dev serves the file contents, as plain Vite does. vp pack stops with
UNLOADABLE_DEPENDENCY, because it tries to open a file literally named
x.svg?raw. An ?inline CSS import in the same file packs fine, so pack
handles some asset queries and not others, and the
pack guide does not say which.
I am filing this here rather than with tsdown because what breaks is the Vite+
promise that one config means the same thing to vp dev and vp pack. Nothing
in the config warns that the two commands read this import differently.
The gap looks small. Rolldown already resolves the import: a plugin's load
hook receives the absolute path with ?raw still attached. Only the default
file reader fails. This plugin in pack.plugins fixes it:
import { readFileSync } from "node:fs";
import type { Plugin } from "vite-plus";
function rawImports(): Plugin {
const RAW = /\?raw$/;
return {
name: "raw-imports",
load: {
filter: { id: RAW },
handler: (id) =>
`export default ${JSON.stringify(readFileSync(id.replace(RAW, ""), "utf-8"))};`,
},
};
}
pack: { loader: { ".svg": "text" } } does not fix it. It matches on file
extension, so the source has to drop ?raw, and then vp dev returns a URL for
the import instead of the contents. That swaps a build error for a silent
difference between dev and the published build.
What I would like:
vp pack handles the asset queries vp dev handles, ?raw at least.
- Failing that, the pack guide lists the queries pack supports, and the error
names the query and points at loader or a plugin.
A related question: tsdown's guide says it "is positioned to become the
foundation for Rolldown Vite's Library Mode". Should library authors on
vp pack expect Vite's asset queries to arrive there eventually, or plan on
keeping their own plugins for them? Either answer is fine to build against. The
closest existing thread is tsdown discussion
#631.
Reproduction
No URL, follow reproduction steps below.
Steps to reproduce
Create the project:
mkdir vp-raw-repro && cd vp-raw-repro && mkdir src
cat > package.json <<'EOF'
{
"name": "vp-raw-repro",
"private": true,
"type": "module",
"devDependencies": { "vite-plus": "1.0.0-rc.0" }
}
EOF
cat > vite.config.ts <<'EOF'
import { defineConfig } from "vite-plus";
export default defineConfig({
pack: { entry: "src/index.ts" },
});
EOF
cat > src/index.ts <<'EOF'
import svg from "./x.svg?raw";
import css from "./y.css?inline";
export { svg, css };
EOF
echo '<svg xmlns="http://www.w3.org/2000/svg"/>' > src/x.svg
echo 'p { color: red; }' > src/y.css
npm install
-
Run npx vp dev. In a second terminal, fetch the URL the dev server rewrites
the import to:
curl -s 'http://localhost:5173/src/x.svg?import&raw'
It prints export default "<svg xmlns=\"http://www.w3.org/2000/svg\"/>\n".
-
Stop the dev server and run npx vp pack. It fails with
UNLOADABLE_DEPENDENCY (log below).
-
Remove the ?raw import and pack again:
printf 'import css from "./y.css?inline";\n\nexport { css };\n' > src/index.ts
npx vp pack
It builds, and dist/index.mjs holds the CSS as a string.
System Info
$ vp env current
Node.js:
Version 24.11.0
Source system PATH
Bin Path /home/myuser/.local/share/zed/node/node-v24.11.0-linux-x64/bin/node
Installed true
Mode system_first
Package Manager:
Name npm
Version 11.6.1
Source system PATH
Bin Paths
npm /home/myuser/.local/share/zed/node/node-v24.11.0-linux-x64/bin/npm
npx /home/myuser/.local/share/zed/node/node-v24.11.0-linux-x64/bin/npx
Installed true
Mode system_first
$ vp --version
vp v1.0.0-rc.0
Local vite-plus:
vite-plus v1.0.0-rc.0
Tools:
vite v8.3.0
rolldown v1.2.9
vitest v5.0.1
oxfmt v0.70.0
oxlint v1.85.0
oxlint-tsgolint v7.0.2002
tsdown v0.23.0
Environment:
Package manager npm default
Node.js v24.21.0
Used Package Manager
npm
Logs
$ npx vp pack
ℹ entry: src/index.ts
ℹ Build start
error: Build failed with 1 error:
[UNLOADABLE_DEPENDENCY] Could not load src/x.svg?raw
╭─[ src/index.ts:1:17 ]
│
1 │ import svg from "./x.svg?raw";
│ ──────┬──────
│ ╰──────── No such file or directory (os error 2)
───╯
at aggregateBindingErrorsIntoJsError (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/node_modules/vite/dist/rolldown/shared/error-CGhV1ebk.mjs:48:18)
at unwrapBindingResult (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/node_modules/vite/dist/rolldown/shared/error-CGhV1ebk.mjs:18:128)
at #build (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/node_modules/vite/dist/rolldown/shared/rolldown-DZGaRc5R.mjs:133:34)
at async build (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/node_modules/vite/dist/rolldown/index.mjs:48:22)
at async Promise.all (index 0)
at async buildSingle (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/node_modules/vite/dist/tsdown/build-JVmLFaZt-BN9yuB6k.js:6380:19)
at async Promise.all (index 0)
at async buildWithConfigs (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/node_modules/vite/dist/tsdown/build-JVmLFaZt-BN9yuB6k.js:6327:18)
at async CAC.<anonymous> (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/dist/pack-bin.js:87:2)
at async runCLI (file:///tmp/vp-issue-repro/verify/vp-raw-repro/node_modules/vite-plus/dist/pack-bin.js:93:3)
Validations
Describe the bug
Disclaimer: I formatted this with an LLM.
My library inlines an HTML template and some SVG icons as strings with
?raw:vp devserves the file contents, as plain Vite does.vp packstops withUNLOADABLE_DEPENDENCY, because it tries to open a file literally namedx.svg?raw. An?inlineCSS import in the same file packs fine, so packhandles some asset queries and not others, and the
pack guide does not say which.
I am filing this here rather than with tsdown because what breaks is the Vite+
promise that one config means the same thing to
vp devandvp pack. Nothingin the config warns that the two commands read this import differently.
The gap looks small. Rolldown already resolves the import: a plugin's
loadhook receives the absolute path with
?rawstill attached. Only the defaultfile reader fails. This plugin in
pack.pluginsfixes it:pack: { loader: { ".svg": "text" } }does not fix it. It matches on fileextension, so the source has to drop
?raw, and thenvp devreturns a URL forthe import instead of the contents. That swaps a build error for a silent
difference between dev and the published build.
What I would like:
vp packhandles the asset queriesvp devhandles,?rawat least.names the query and points at
loaderor a plugin.A related question: tsdown's guide says it "is positioned to become the
foundation for Rolldown Vite's Library Mode". Should library authors on
vp packexpect Vite's asset queries to arrive there eventually, or plan onkeeping their own plugins for them? Either answer is fine to build against. The
closest existing thread is tsdown discussion
#631.
Reproduction
No URL, follow reproduction steps below.
Steps to reproduce
Create the project:
Run
npx vp dev. In a second terminal, fetch the URL the dev server rewritesthe import to:
curl -s 'http://localhost:5173/src/x.svg?import&raw'It prints
export default "<svg xmlns=\"http://www.w3.org/2000/svg\"/>\n".Stop the dev server and run
npx vp pack. It fails withUNLOADABLE_DEPENDENCY(log below).Remove the
?rawimport and pack again:It builds, and
dist/index.mjsholds the CSS as a string.System Info
Used Package Manager
npm
Logs
Validations