Question

我正在使用tsc --p typescript/tsconfig.json --outFile "dist/umd/index.d.ts"编译代码。

我的tsconfig.json文件是：

{
  "include": ["../src/**/*"],
  "exclude": ["../**/*.test.ts"],
  "compilerOptions": {
    "target": "es2015",
    "lib": ["dom", "es2017"],
    "moduleResolution": "node",
    "module": "amd"
  }
}

但是生成的index.d.ts文件如下所示：

var __spreadArrays = (this && this.__spreadArrays) || function () {
    for (var s = 0, i = 0, il = arguments.length; i < il; i++) s += arguments[i].length;
    for (var r = Array(s), k = 0, i = 0; i < il; i++)
        for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++)
            r[k] = a[j];
    return r;
};
var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
define("enums", ["require", "exports"], function (require, exports) {
    "use strict";
    exports.__esModule = true;
    exports.top = 'top';
    exports.bottom = 'bottom';
    exports.right = 'right';
    exports.left = 'left';
    exports.auto = 'auto';
    exports.basePlacements = [exports.top, exports.bottom, exports.right, exports.left];
    exports.start = 'start';
    exports.end = 'end';
    exports.center = 'center';
    exports.edges = 'edges';
    exports.surfaces = 'surfaces';
    exports.clippingParent = 'clippingParent';
    exports.viewport = 'viewport';
    exports.placements = exports.basePlacements.reduce(function (acc, placement) { return acc.concat([placement, placement + "-" + exports.start, placement + "-" + exports.end]); }, []);
    // modifiers that need to read the DOM
    exports.beforeRead = 'beforeRead';
    exports.read = 'read';
    exports.afterRead = 'afterRead';
    // pure-logic modifiers
    exports.beforeMain = 'beforeMain';
    exports.main = 'main';
    exports.afterMain = 'afterMain';
    // modifier with the purpose to write to the DOM (or write into a framework state)
    exports.beforeWrite = 'beforeWrite';
    exports.write = 'write';
    exports.afterWrite = 'afterWrite';
    exports.modifierPhases = [exports.beforeRead, exports.read, exports.afterRead, exports.beforeMain, exports.main, exports.afterMain, exports.beforeWrite, exports.write, exports.afterWrite];
});
define("types", ["require", "exports"], function (require, exports) {
    "use strict";
    exports.__esModule = true;
    exports["default"] = null;
});
define("dom-utils/getBoundingClientRect", ["require", "exports"], function (require, exports) {
    "use strict";
    exports.__esModule = true;
    exports["default"] = (function (element) {
        var rect = JSON.parse(JSON.stringify(element.getBoundingClientRect()));
        rect.x = rect.left;
        rect.y = rect.top;
        return rect;
    });
});

当我尝试使用它时，TypeScript抱怨：

dist/umd/index.d.ts:1:1 - error TS1036: Statements are not allowed in ambient contexts.

1 define("enums", ["require", "exports"], function (require, exports) {
  ~~~~~~

和：

dist/umd/index.d.ts:1:1 - error TS2304: Cannot find name 'define'.

1 define("enums", ["require", "exports"], function (require, exports) {
  ~~~~~~

和：

tests/typescript/base.ts:1:30 - error TS2306: File '/Users/federicozivolo/Projects/popper.js/dist/umd/index.d.ts' is not a module.

1 import { createPopper } from '@popperjs/core';

为什么TypeScript生成的文件然后不能与TypeScript本身一起使用？为什么使用define而不是export？

（如果有帮助，请在这里找到完整的代码https://github.com/popperjs/popper.js/pull/849）

Answer 1

像这样调用tsc将始终为您提供带有运行时代码的JavaScript文件。 .d.ts是TypeScript声明的文件扩展名，因此，您在这里绝对没有实现所需的功能。

如果要有一个声明文件（或一个声明文件），则不能使用outFile。相反，通常必须通过正常调用.d.ts将所有代码编译成多个tsc文件，然后使用诸如api-extractor之类的工具从所有文件中生成一个组合的.d.ts文件那些。

TypeScript生成具有定义声明而不是导出声明的.d.ts文件

1 个答案: