IDE throws error on `?url&raw` import

[ben221199]

Description

Our website is made with VitePress and deployed on Cloudflare Pages. For redirects, we use Cloudflare's _redirects file, but this does only work on initial requests, not on secondary requests (due to single page) or during development.

To fix this, I imported the _redirects file:

import _redirects from "/_redirects?url&raw";
const redirects = _redirects
  .split("\n")
  .filter(String)
  .map((item: string[]) => item.split(/\x20+/))
  .filter(
    (item: string) =>
      item[0].indexOf(":") === -1 && item[0].indexOf("*") === -1,
  );

And then, inside the layout's enhanceApp function, I catch the redirects:

    router.onAfterRouteChange = async (to: string) => {
      // Static redirects
      redirects.forEach((item: string[]) => {
        if (
          to === item[0] ||
          to.startsWith(item[0] + "?") ||
          to.startsWith(item[0] + "#")
        ) {
          router.go(item[1]);
        }
      });
    };

This works fine, but I noticed that my IDE gave errors on the import line, caused by ?url&raw. I was not able to use ?raw directly, because of:

vite/packages/vite/src/node/plugins/importAnalysis.ts

Line 553 in dafd726

throw new Error(

---

Is there a reason why there isn't a declare module '*?url&raw' defined in Vite? Is a bug of Vite, or is my method badly wrong?

Suggested solution

Add:

declare module '*?url&raw' {
  const src: string
  export default src
}

Alternative

No response

Additional context

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

[bluwy]

Perhaps we should not log the error if there's ?raw for public files. ?url&raw doesn't quite make sense together since effectively you get the raw code and not any urls.

The related code is at

vite/packages/vite/src/node/plugins/importAnalysis.ts

Lines 543 to 562 in 181d870

	// warn imports to non-asset /public files
	if (
	specifier[0] === '/' &&
	!(
	config.assetsInclude(cleanUrl(specifier)) ||
	urlRE.test(specifier)
	) &&
	checkPublicFile(specifier, config)
	) {
	throw new Error(
	`Cannot import non-asset file ${specifier} which is inside /public. ` +
	`JS/CSS files inside /public are copied as-is on build and ` +
	`can only be referenced via <script src> or <link href> in html. ` +
	`If you want to get the URL of that file, use ${injectQuery(
	specifier,
	'url',
	)} instead.`,
	)
	}

This seems to be intended as a warning, not sure why it's a hard error. Maybe that can be addressed separately.