对外部JavaScript库使用TypeScript声明

我不确定这个极端边缘案例或者其他什么，但我似乎无法找到关于如何做到这一点的直截了当的文档（或者我真的不了解可用的内容）：对外部JavaScript库使用TypeScript声明

我正在开发离子应用程序，并且我需要使用ALKMaps JavaScript库（类似于Google Maps API）的一部分。为此，我创建了一个本地npm模块，并在其中创建了一个由https://www.typescriptlang.org/docs/handbook/declaration-files/by-example.html#objects-with-properties推荐的alkmaps.d.ts文件）。但是，我似乎无法弄清楚如何正确地将其导入到角码中。同一个文件表明，使用<reference path=''>标签并不好，但这是唯一似乎满足tsc编译器的东西。

我的声明文件，alkmaps.d.ts，看起来像（不包括内为简洁起见）：

declare namespace ALKMaps { 
    export class Map { ... } 
    ... 
}

我试图将其导入到像一个文件：

import { ALKMaps } from 'alkmaps'; // Error: File '.../alkmaps.d.ts' is not a module

我也尝试了以下，但得到了同样的错误。

import ALKMaps = require('alkmaps');

使用参考标签，似乎此模块中工作，但再利用该模块还抛出项目“是不是一个模块”的错误（这可能需要建立单独的问题）

从https://github.com/Microsoft/TypeScript/issues/11420我发现使用export = ALKMaps或export as namespace ALKMaps但将其添加到我的声明文件导致不同的错误，而不是。

任何人都可以请直接解释如何使用代表外部JS库在打字稿节点模块中的声明文件？

来源

2017-03-07 Mike

从'alkmaps'和import ALKMaps = require（'alkmaps'）'进口{ALKMaps}'在运行时做两件非常不同的事情。你是什么意思？ –

那是我对node.js有限理解的一个方面。我尝试了这两种形式的导入（当然不是同一时间），尝试用“不是模块”错误纠正问题。 – Mike

这是我能得到alkMaps进入我的角2的应用程序

插入脚本到index.html文件。

声明组件中的ALKMaps变量，您要添加的地图

imports ..... 

declare let ALKMaps : any; 
@Component({ 
    selector: 'show-map', 
    templateUrl: 'show-map.component.html' 
}) 

export class ShowMapComponent implements Oninit{ 
    map : any; 

    constructor() { 
    } 

    ngOnInit() { 
     ALKMaps.APIKey = "apiKey"; 
     this.map = new ALKMaps.Map("map", {displayProjection: new ALKMaps.Projection("EPSG:4326")}); 
    } 
}

这将让地图显示，你可以把不同层的地图上，但是地图上显示不正确。 @Mike，如果你能够做得更好，请你评论一下吗？

编辑：图像上的瓷砖拉长，没有连接。检查CSS中的main.css后，建成后，img元素上设置一个全局属性：

img { 
    max-width:100% 
}

对于本来设置为256％的宽度地图瓦片。为了纠正元素，我改变了样式表中img的属性。

show-map { 
    img { 
     max-width: 256% 
    } 
}

来源

2018-01-30 23:41:20

我刚开始研究一些与此相关的代码。我能做的最好的是创建2个私有NPM模块：1）将更高级别的映射存储到ALK Maps库，2）存储.d.ts文件。第1个NPM模块对第2个模块有依赖关系，并查看它以获取类型。（我最终命名了第二个“@ types/alkmaps”，这在技术上是错误的，但由于它是一个私有的repo，所以它应该没问题，这使TypeScript更容易从该模块中找到类型）。 – Mike

对外部JavaScript库使用TypeScript声明

回答

相关问题