在package.json上使用SystemJS和Karma - 404

时间:2017-07-10 18:08:46

标签: angularjs npm karma-jasmine systemjs karma-systemjs

问题:

尝试使用karma-systemjs将SystemJS配置与Karma集成,但是Karma抱怨无法为每次导入找到package.json文件:

...
10 07 2017 13:38:15.107:WARN [web-server]: 404: /node_modules/angular-mocks/package.json
10 07 2017 13:38:15.380:WARN [web-server]: 404: /node_modules/moment/package.json
10 07 2017 13:38:15.382:WARN [web-server]: 404: /node_modules/angular/package.json
PhantomJS 2.1.1 (Windows 7 0.0.0) ERROR
  Error: (SystemJS) XHR error (404 Not Found) loading http://localhost:9876/node_modules/angular-mocks/package.json
    Error loading http://localhost:9876/node_modules/angular-mocks/package.json
    Error loading build/js/app.spec.js

PhantomJS 2.1.1 (Windows 7 0.0.0): Executed 0 of 0 ERROR (0.945 secs / 0 secs)

上面已被截断,但输出上方还有几个缺少package.json警告。此外,这些错误仅与Karma有关,实际上应用程序本身在下面的设置中运行良好。

依赖版本:

  • "karma": "1.7.0"
  • "karma-jasmine": "1.1.0"
  • "karma-systemjs": "0.16.0"
  • "systemjs": "0.19.47"

SystemJS配置:

(参考:https://github.com/systemjs/systemjs/issues/767#issuecomment-139515090

System.config({
  defaultJSExtensions: true,
  transpiler: "babel",
  babelOptions: {
    "optional": [
      "runtime",
      "optimisation.modules.system"
    ]
  },
  paths: {
    '*': './node_modules/*',
  },
  packageConfigPaths:  ['./node_modules/*/package.json'],
  map: {
    'systemjs': './node_modules/systemjs/dist/system.js',
    'system-polyfills': './node_modules/systemjs/dist/system-polyfills.js',
    'babel': './node_modules/babel-core/browser.js',
    'angular-feature-flags': './node_modules/angular-feature-flags/dist/featureFlags.min.js',
    crypto: '@empty',
    fs: '@empty',
    stream: '@empty'
  }
});

Karma配置:

module.exports = function (config) {
  "use strict";
  config.set({
    autoWatch: true,
    singleRun: false,
    port: 9876,
    frameworks: ["systemjs", "jasmine"],

    babelPreprocessor: {
      options: {
        compact: true
      }
    },

    files: [
      "node_modules/phantomjs-polyfill-object-assign/object-assign-polyfill.js",
      {pattern: "app/assets/images/**/*", watched: false, included: false, served: true},
      "build/**/*spec*.js"
    ],

    systemjs: {
      configFile: "./config.js",
      serveFiles: [
        './build/**/*.js'
      ]
    },
    browsers: ["PhantomJS"],
    reporters: ["spec"]
  });

};

1 个答案:

答案 0 :(得分:0)

karma-systemjs应该读取您的SystemJS配置并自动告诉karma提供您告诉SystemJS的文件。但是,我查看了karma-systemjs的代码,我认为没有任何条款可以处理packageConfigPaths。 (以及项目needs a new maintainer,它不会激发信心。)因此,您应该在files配置中添加一个元素,如:

{ pattern: "node_modules/**/package.json", included: false }

我建议使用**模式,以便您可以自动处理node_modules/@angular/core/package.json之类的路径,这些路径超过一个级别。