ecmascript 6-Typescript:单元测试和依赖关系

我很难在Typescript中为我的宠物项目设置单元测试。

考虑以下目录结构

/src
   /test
      unittest.ts
      unittest.html
    main.ts

main.ts:

class Point {
    constructor(public x: number, public y: number) {
    }
}
export { Point };

unittest.ts

import Point from "../main";
function basicTest() {
   let Point = new Point(10, 15);
   // ... 
}
basicTest();

unittest.html

<html>
  <meta charset="UTF-8">
  <head></head>
  <body>
    <script src="unittest.js" charset="utf-8"></script>
  </body>
</html>

编译此代码后tsc src/test/unittest.ts && open src/test/unittests.html

我看到以下错误ReferenceError: require is not defined。

我曾尝试将requirejs添加到unittest.html中，但它导致了一些模糊的错误。在编译过程中，我还尝试使用--module system和--module amd，但没有成功）。

我错过了一些依赖吗？

谢谢！

测试中的导入行将编译为。。。

var foo_1 = require("./foo");

需要配置require语句。Javascript没有提供开箱即用的模块加载支持。有几种不同的方法可以做到。它们都是关于"我如何找到请求的模块并加载它"的不同方法。我会让你对Javascript中的各种模块解析机制进行一些研究，但有四种主要方法：

CommonJS（遗留节点/后端机制）
AMD（传统浏览器/前端机制）
global（最古老的浏览器方法，不使用require，您只需使用<script>标记引用HTML中的依赖库）
ES2015（旨在统一所有这些方法的更新机制）

如果这是一个更新的项目，你可能想要一个支持ES2015风格的工具。RequireJS是一个支持AMD模块加载的工具。您可能想了解Webpack或SystemJS这两种流行的方法。我主要使用SystemJS。你通常不想手动配置SystemJS，我建议你使用jspm来配置。你可以在这里找到入门指南。

如果你想看看Webpack，你可以从这里开始。

在这种情况下，解决依赖关系的最简单方法似乎是使用browserify及其插件tsify:

browserify src/test/unittest.ts -p [ tsify --debug ] > src/test/unittest.js

相关内容

最新更新

热门标签：