Javascript 如何在汇总中处理svg导入（ES6）

如果我要将svg文件导入ES6模块，如何在汇总中处理它？我现在有这样一个例子（我正在做的简单例子）：

我有一个汇总配置，如下所示：

import babel from 'rollup-plugin-babel';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';

export default {
  entry: 'src/app.js',
  dest: 'build/app.min.js',
  format: 'iife',
  sourceMap: 'inline',
  plugins: [
    babel({
      exclude: 'node_modules/**',
    }),
    resolve({
      jsnext: true,
      main: true,
      browser: true,
    }),
    commonjs(),
  ],
};

然后我得到以下错误：

无法从中解析“../assets/next.svg” /home/magnferm/projects/slask/rollup test/src/chill/index.js

---

路径没有问题，但是rollup似乎不知道如何处理svg文件。是否有一个插件我可以使用，或者我必须以不同的方式对待它？

当然有一个插件。它被称为汇总插件图像，处理其他格式。svg导入：

import babel from 'rollup-plugin-babel';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';
import image from 'rollup-plugin-image';

export default {
  entry: 'src/app.js',
  dest: 'build/appn.min.js',
  format: 'iife',
  sourceMap: 'inline',
  plugins: [
    babel({
      exclude: 'node_modules/**',
    }),
    resolve({
      jsnext: true,
      main: true,
      browser: true,
    }),
    commonjs(),
    image()
  ],
};

---

您好，这个插件还有一个类似的问题：

无法加载/Users/stan/dev/projects/front-boilerplate/src/icons/baseline-delete\u-ever-24px.svg.js

为什么rollup要查找

svg.js

文件？

import babel from 'rollup-plugin-babel';
import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';
import image from 'rollup-plugin-image';

export default {
  entry: 'src/app.js',
  dest: 'build/appn.min.js',
  format: 'iife',
  sourceMap: 'inline',
  plugins: [
    babel({
      exclude: 'node_modules/**',
    }),
    resolve({
      jsnext: true,
      main: true,
      browser: true,
    }),
    commonjs(),
    image()
  ],
};