• Ian Sutherland's avatar
    Named asset import for SVG files (#3907) · d0e17316
    Ian Sutherland authored
    * Add named asset import for svg files via babel plugin and webpack loader.
    
    * Fix failing e2e test
    
    * Switched to svgr loader
    
    * Updated SVG component test
    
    * Disable named asset import plugin in test environment
    
    * Added tests for including SVG in CSS
    
    * Update tests
    
    * Moved babel plugin config into webpack config
    Unverified
    d0e17316
index.js 1.72 KiB
'use strict';
const { extname } = require('path');
function namedAssetImportPlugin({ types: t }) {
  const visited = new WeakSet();
  return {
    visitor: {
      ImportDeclaration(path, { opts: { loaderMap } }) {
        const sourcePath = path.node.source.value;
        const ext = extname(sourcePath).substr(1);
        if (visited.has(path.node) || sourcePath.indexOf('!') !== -1) {
          return;
        if (loaderMap[ext]) {
          path.replaceWithMultiple(
            path.node.specifiers.map(specifier => {
              if (t.isImportDefaultSpecifier(specifier)) {
                const newDefaultImport = t.importDeclaration(
                    t.importDefaultSpecifier(
                      t.identifier(specifier.local.name)
                  t.stringLiteral(sourcePath)
                visited.add(newDefaultImport);
                return newDefaultImport;
              const newImport = t.importDeclaration(
                  t.importSpecifier(
                    t.identifier(specifier.local.name),
                    t.identifier(specifier.imported.name)
                t.stringLiteral(
                  loaderMap[ext][specifier.imported.name]
                    ? loaderMap[ext][specifier.imported.name].replace(
                        /\[path\]/,
                        sourcePath
                    : sourcePath
              visited.add(newImport);
              return newImport;
module.exports = namedAssetImportPlugin;