Question

我正在尝试创建一个共享的UI组件。我想利用Typescript给出的开发反馈，但是创建转换后的文件，使得不需要模块加载器来使用它。

我已经完成了所有这些工作，但是也希望围绕它设置一些单元测试。这给我带来了很多问题。我的app结构如下所示：

karma.conf.js
gulpfile.js
dist/
  component.js
src/
  component.ts
test/
  unit/
    component.spec.ts

在gulpfile.js我有两项任务。一个构建打字稿文件并将构建的.js文件放在dist/中的文件。

如果我运行gulp build命令，然后使用以下gulp test文件运行karma.conf.js命令，则所有测试都通过：

module.exports = function(config) {
  config.set({
    basePath: './',
    frameworks: ['jasmine'],
    files: [
      'dist/js/pager.js',
      'test/unit/*.spec.ts'
    ],
    exclude: [],
    preprocessors: { },
    reporters: ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: false,
    browsers: ['Chrome'],
    singleRun: false
  });
};

注意：我明确地提取了构建.js文件。

我想做的是在.ts文件上运行测试，以便我可以使gulp build任务依赖于gulp test任务。

我尝试使用如下所示的karma.conf.js文件：

module.exports = function(config) {
  config.set({
    basePath: './',
    frameworks: ['jasmine', 'karma-typescript'],
    files: [
      'src/**/*.ts',
      'test/unit/*.spec.ts'
    ],
    exclude: [],
    preprocessors: { 
      "src/**/*.ts": ["karma-typescript"]
    },
    reporters: ['progress', 'karma-typescript'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: false,
    browsers: ['Chrome'],
    singleRun: false
  });
};

但我仍然会收到此错误："ReferenceError: Component is not defined"

由于上面的.js版本似乎正在运行，我的假设是即使在.ts版本中也加载了文件，但是它们没有被编译。这让我很困惑，因为.spec文件也是打字稿文件，而且这些文件正在构建得很好。

我尝试过包含对该组件顶部的引用 spec文件，如/// <reference path="../../src/component.ts" />。
我尝试过利用 karma-typescript-preprocessor2。
我也尝试使用systemjs尝试将其视为模块，但都无济于事。

我确信有一些明显的东西让我失踪，但似乎无法看到它。任何帮助将不胜感激！

是否可以将karma与typescript文件一起使用而不使用模块加载器？

0 个答案: