babel-plugin-named-asset-import

⚠️ This was just a proof of concept and is in no way meant to be used. Something similar was implemented into CRA in this PR. ⚠️

Proof of Concept for facebookincubator/create-react-app#3722 implemented as a bable plugin.

This will translate this:

import { url as logoUrl } from './logo.png';
import { html as docHtml } from './doc.md';
import { ReactComponent as Icon } from './icon.svg';

into

import logoUrl from 'url-loader!./logo.png';
import docHtml from 'html-loader!markdown-loader!./doc.md';
import Icon from 'svg-react-loader!./icon.svg';"

The webpack configuration of the various loaders is left to the user (e.g. create-react-app).

Edge Cases

Default Import

For now default imports will be left as is. This allows the user to configure its own "default" behaviour. import Icon from './icon.svg'; will be left as is.

Request of an unkown asset

import { someUnkownAsset } from './icon.svg' 

Will currently result in a compile time error like this:

SyntaxError: filename.js: Unkown asset requested, possible assets are: url, raw, ReactComponent