在Angular-Cli中加载SVG文件

Question

我们正在Angular 2项目中使用Angular CLI。该项目使用一个大型SVG，该SVG存储在node_modules文件夹中，并且需要在运行时下载svg。

如果我们将其添加到angular-cli.json

"addons": [
    "../node_modules/my_module/**/*.svg"
],

然后require(../node_modules/my_module/icons.svg);在我们的组件之一中，svg文件被散列并按预期工作。

该解决方案的问题是测试失败，业力输出：

ERROR in ./node_modules/my_module/icons.svg
Module parse failed: path-to-svg/node_modules/my_module/icons.svg Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
| <svg>
|     <defs>

问题是将这个文件包含在捆绑程序中的正确方法是什么？

Karma.conf.js：

module.exports = function (config) {
  config.set({
    basePath: '../',
    frameworks: ['jasmine', 'angular-cli'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-phantomjs-launcher'),
      require('karma-remap-istanbul'),
      require('angular-cli/plugins/karma')
    ],
    files: [
      { pattern: './src/test.ts', watched: false }
    ],
    preprocessors: {
      './src/test.ts': ['angular-cli']
    },
    remapIstanbulReporter: {
      reports: {
        html: 'coverage',
        lcovonly: './coverage/coverage.lcov'
      }
    },
    angularCli: {
      config: './angular-cli.json',
      environment: 'dev'
    },
    reporters: ['progress', 'karma-remap-istanbul'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['PhantomJS'],
    singleRun: false
  });
};