Why is .js appended to svg imports?

[laruiss]

Hi, with this config

// rollup.config.json
import path from 'path'

import alias from 'rollup-plugin-alias'
import babel from 'rollup-plugin-babel'
import browsersync from 'rollup-plugin-browsersync'
import commonjs from 'rollup-plugin-commonjs'
import css from 'rollup-plugin-css-only'
import htmlTemplate from 'rollup-plugin-generate-html-template'
import nodeResolve from 'rollup-plugin-node-resolve'
import image from 'rollup-plugin-image'

const isDev = process.env.NODE_ENV !== 'production'

export default {
  external: ['jquery'],
  input: 'src/index.js',
  output: {
    file: 'dist/bundle.js',
    format: 'iife',
    globals: {
      jquery: '$',
    },
  },
  plugins: [
    alias({
      '@': path.join(__dirname, 'src'),
    }),
    babel({
      exclude: 'node_modules/**',
    }),
    browsersync({ server: 'dist' }),
    commonjs({
      include: 'node_modules/**',
      ignoreGlobal: false,
      sourceMap: isDev,
      exclude: [
        'node_modules/process-es6/**',
      ],
      namedExports: {
        'node_modules/react/index.js': ['Children', 'Component', 'PropTypes', 'createElement'],
        'node_modules/react-dom/index.js': ['render'],
        'node_modules/uuid/index.js': ['v4'],
        'node_modules/react-is/index.js': ['isValidElementType'],
      },
    }),
    css(),
    htmlTemplate({
      template: 'src/template.html',
      target: 'index.html',
    }),
    image(),
    nodeResolve({
      browser: true,
      jsnext: true,
      main: true,
    }),
  ],
  watch: {
    chokidar: true,
    include: 'src/**',
  },
}

When I write

import DeleteIcon from '@/icons/baseline-delete_forever-24px.svg'

I get Error: Could not load /<irrelevant>/<rollup-project-folder>/src/icons/baseline-delete_forever-24px.svg.js

What am I doing wrong?

[shellscape]

We're moving this plugin to https://github.com/rollup/plugins where it'll get some TLC. Keep an eye out for this repo being archived and @rollup/plugin-images.