繁体   English   中英

使用TypeScript 2.0导入js文件

[英]Import js file with TypeScript 2.0

抽象

我正在尝试从外部位置导入“.js”文件(即node_modules )我正在尝试使用commonjs模块模式执行此操作,但是导入不希望使用“.js”文件类型,直到我添加“ .d.ts“文件附近”.js“文件位于同一文件夹中。

但问题是我不想用我的“.d.ts”文件影响任何node_modules 我希望它位于另一个文件夹中,与node_modules分开,但是一旦我这样做, typescript编译器就会抛出一个错误:

我有以下文件夹结构:

|- DTS
|   |- y.d.ts
|- main.ts
|- y.js

y.js具有以下内容

module.export = function (x) {
    console.log(x);
};

ydts具有以下内容

export interface Y {
    (x): any;
}
declare let y: Y;
export default y;

main.ts具有以下内容

import * as y from './y'

现在,当我尝试编译main.ts时:

tsc -m commonjs -t ES2015 main.ts

我会收到一个错误:

x.ts(1,20): error TS2307: Cannot find module './y'.

如何导入“.js”文件并能够定义它的“.d.ts”声明,同时让两个文件位于不同的位置。


编辑

这是示例项目的链接 一定要使用TypeScript 2.0版编译器。 并在上面的tsc命令中查看错误。

注意: 证明您的类型定义官方建议采用的方法略有不同,如下所示。 我认为下面的方法略好一些,因为* .d.ts文件几乎与最终产品相同。

在类型检查(构建时)期间,TypeScript使用* .ts文件和(大多数) 忽略* .js文件 让我举一个例子来激励你(我相信)你提出的建议。 假设存在一个非常好的JavaScript库,遗憾的是没有任何类型(例如N3 )。 已通过npm安装,因此:

npm install n3 --save

这是典型的,添加到./node_modules/n3 / ...和project.json。 如上所述,输入不存在,需要手动添加。 我为此创建了一个./@types/n3.d.ts文件。 对于我们的目的而言,定义实际上并不是特别重要,但以下内容是一个良好的开端:

declare namespace N3 {
}

declare module "n3" {
    export = N3;
}

现在回答你的问题。 更新' tsconfig.json ':

...
"compilerOptions": {
    "typeRoots": [
      "node_modules/@types",
      "@types"
    ],
...
"paths": {
  "*": [
    ...
    "./@types/*"
  ]

仍然需要处理用于查找相应* .js文件的运行时解析,但这与您提出的问题不同。

作为参考,您可以找到TypeScript中的新功能此讨论主题非常有用。

这种方法在处理全局变量时工作正常,但与模块不同。

更新' tsconfig.json ':

...
"paths": {
  "*": [
    ...
    "./@types/*"
  ],
  "foo": [ "./@types/foo.d.ts" ]
  },
 ...

能够定义它的“.d.ts”声明,同时让两个文件位于不同的位置。

当给定带有相关文件的.js.d.ts文件时, import遵循相同的模块解析过程。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM