在commonjs和ejs之间共享文件，类型记录不是commonjs文件上的module.ts(2306)。

Question

背景

我有一个文件需要在两个存储库之间共享。该文件包含一个对象。

• 回购A被设置为只接受commonjs文件(require("/path/to/file"))，我很难访问它的babel吐露。
• 回购B使用的是ES6 import foo from "bar"导入风格，我可以使用它的tsconfig.json。

我知道，如果我使用modules.export = myObject，它只适用于公共回购(回购A)，如果我做export = myObject或export default myObject，它只适用于ES6回购(回购B)。

问题：

1. 这是否可以使为两个系统提供相同的文件？我尝试过export = modules.export = myObject或其他任何组合，但都没有效果。
2. 如何在ES6回购中导入commonjs版本？--我试着将它保留为一个commonjs modules.export = myObject文件，但是在回购B中，当我执行import foo from "path/to/file"时，它总是发出以下消息。当我把它换成export = myObject的时候，它就消失了，但是它对回购A不起作用。

File '/path/to/file.ts' is not a module.ts(2306)

备注

1. 我发现在我的tsconfig.json 应该让它起作用中设置tsconfig.json，但是不管我做什么( tsconfig.json中的任何"module"值，打开allowSyntheticDefaultImports)，它都不起作用。我一直收到同样的2306错误。
2. 正如我在注释中提到的，可以认为该文件包含一个静态对象。(例如{a: 5, b: 8};)

tsconfig.json

在回购A部分，我正在接触的是类星体配置文件和它是在香草JS。

Repo是类型记录/节点项目，其中tsconfig.json的相关部分是：

"compilerOptions": {
        "baseUrl": ".",
        "esModuleInterop": true,
        "experimentalDecorators": true,
        "module": "commonjs",
        "moduleResolution": "node",
        "outDir": "dist",
        "strict": true,
        "sourceMap": true,
        "target": "es6",
        ...

Answer 1

我刚刚发现，只要该文件是一个具有正确JSON格式的.json文件，就可以在ES6 (import)和CommonJS (require)中使用它。

对于这个答案 (和这篇文章)，对于ES6，您需要在tsconfig.json中启用"resolveJsonModule": true,，然后可以同时使用这两种格式的内容。

因此，如果文件content.json具有以下内容(没有注释或任何其他内容)：

{
   "age": 34
}

那我们就有..。

import * as jsonContent from "../../content.json"

console.log(jsonContent.age); // prints out 34

以及

const jsonContent = require("../../content.json");

console.log(jsonContent.age); // prints out 34

他们都成功地打印出了内容！

Answer 2

我已经找到了一个解决方案，但是在commonjs领域中的导入语法并不是最好的，但是我希望它对您是有用的。

除了指定commonjs和es6样式导入之外，您没有提供任何其他信息来说明您的项目是如何设置的，所以我将在这里讨论一下。还值得注意的是，虽然包含这些文件是有效的，但是当使用commonjs风格的导入时，它们被键入，而不是保留它们的类型记录类型(我无法使用commonjs风格的导入(require) -我已经很久没有使用这个导入语法了，所以正确的tsconfig.json选项使其工作起来就可以了)。

我将共享代码移到它自己的项目中，并使用以下tsconfig设置编译它：

共享tsconfig.json：

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "ES5",
        "lib": [ "ES5" ],
    }
}

Shared.ts：

export default {'a': 1, 'b': 2};

Shared.js (输出)：

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = { 'a': 1, 'b': 2 };

(请注意，这个输出是commonjs风格的，因为ES6与commonjs文件兼容)。

直接使用require时，需要在导入的文件上引用.default变量：

commonjs.ts

var val = require("../shared/shared").default;

console.log(val);

但是，如果配置为可以将ES6风格的导入和输出写入公共程序，则可以使用以下语法(这将为您提供键入信息)：

commonjs.ts

import val from "../shared/shared";

console.log(val);

以上两个文件都是用以下tsconfig编译的：

tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "lib": [ "es5" ],
        "types": ["node"]
    }
}

ES6导入非常直截了当：

es6.ts

import shared from "../shared/shared";

console.log(shared);

tsconfig.json：

{
    "compilerOptions": {
        "module": "ES6",
        "target": "es6",
        "lib": [ "es6" ]
    }
}

我很怀疑这不能百分之百地解决你的问题，但是我需要每个项目的tsconfig设置作为每个项目的类型记录编译器的版本，这样才能得到更准确的答案。

Answer 3

我经历了更多，并提出了另一个解决方案，你可能更喜欢。

我还没有弄清楚如何在通用js风格的导入中输入，但是如果运行导入，它确实可以工作，并且不会导致编译器错误。

我将共享代码移到它自己的项目中，并将其编译到另一个目录中。这是因为"esModuleInterop“标志在导入类型记录文件时不起作用，所以我将带有支持.d.ts文件的javascript文件编译到另一个目录，这样源.ts文件就不会引起冲突。

共享tsconfig.json：

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "ES5",
        "lib": [ "ES5" ],
        "declaration": true,
        "outDir": "../sharedOut"
    }
}

Shared.ts：

export = {'a': 1, 'b': 2};

在你应该得到的输出文件夹中：

Shared.js：

"use strict";
module.exports = { 'a': 1, 'b': 2 };

Shared.d.ts

declare const _default: {
    a: number;
    b: number;
};
export = _default;

这导致您的公共to导入如下所示：

commonjs.ts

var val = require("../sharedOut/shared");

console.log(val);

或者(如果您可以使用ES6风格的导入，但需要输出为commonjs)：

import val from "../sharedOut/shared";

console.log(val);

以上两个文件都是用以下tsconfig编译的：

tsconfig.json

{
    "compilerOptions": {
        "module": "commonjs",
        "target": "es5",
        "lib": [ "es5" ],
        "types": ["node"],
        "esModuleInterop": true
    }
}

ES6导入(同样)是非常直接的：

es6.ts

import shared from "../shared/shared";

console.log(shared);

tsconfig.json：

{
    "compilerOptions": {
        "module": "ES6",
        "target": "es6",
        "lib": [ "es6" ],
        "esModuleInterop": true
    }
}

再次，如果这不能解决你的问题，我将需要更多的信息，以取得进展。我需要每个项目的tsconfig设置，作为您为每个项目使用的类型记录编译器的版本，以获得更准确的答案。