Proposal: explicit query param imports for non-JS/CSS assets

[xiaoxiangmoe]

Previous Proposal

see @gaearon 's Proposal: explicit named imports for non-JS/CSS assets #3722

Proposal

import logoUrl from './logo.svg?type=url';
import docHtml from './doc.md?type=html'; // Load as html string
import docText from './doc.md?type=raw';  // Load as raw string
import docAst from './doc.md?type=ast';   // Load as ast tree object
import Icon from './icon.svg?type=ReactComponent';

see ECMAScript Modules - Node.js | URL based paths:

Modules will be loaded multiple times if the import specifier used to resolve them have a different query or fragment.

docHtml and docHtmlText will load as different type by different webpack loader.

Concerns

• TypeScript support for query params and fragment in ModuleSpecifier. @ahejlsberg

[iansu]

We've already implemented this feature (in a slightly different way) for SVGs: https://facebook.github.io/create-react-app/docs/adding-images-fonts-and-files#adding-svgs

[xiaoxiangmoe]

@iansu but this proposal seems to be more browser compatible. (like uri)

[miraage]

@xiaoxiangmoe how will other users migrate if they load multiple types in one import statement?

[xiaoxiangmoe]

@miraage load multiple types in one import statement will also work without query params

[gaearon]

@xiaoxiangmoe Just because you use URLs doesn't make it any more "browser compatible". :-)

[gaearon]

We'll want to watch this: https://github.com/sebmarkbage/ecmascript-asset-references

[xiaoxiangmoe]

@gaearon see: parcel-bundler/parcel#2306

I want it could be zero configuration.

[stale]

This issue has been automatically marked as stale because it has not had any recent activity. It will be closed in 5 days if no further activity occurs.