본문 바로가기

개발하자

TypeScript는 내보내기 선언 대신 정의된 선언이 있는 .d.ts 파일을 생성합니다

반응형

TypeScript는 내보내기 선언 대신 정의된 선언이 있는 .d.ts 파일을 생성합니다

나는 내 코드를 컴파일하고 있다.

내 파일:

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

그러나 생성된 파일은 다음과 같습니다:

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 자체와 함께 작동하지 않는 파일을 생성하는가? 왜 대신 사용하는 거죠?

(도움이 될 수 있다면, 여기서 전체 코드를 찾을 수 있습니다)




그렇게 부르면 항상 런타임 코드가 있는 자바스크립트 파일을 얻을 수 있다. TypeScript 선언을 위한 파일 확장자이므로 여기서 원하는 것을 확실히 달성하지 못하고 있습니다.

단일 선언 파일(또는 선언 파일)을 사용하려는 경우 를 사용할 수 없습니다. 대신 정상적으로 호출하여 모든 코드를 여러 파일로 컴파일한 다음 같은 도구를 사용하여 모든 파일 중 하나를 결합하여 생성해야 합니다.


반응형