在打字稿中导入库的不同方式有什么区别?

肯尼斯·林恩

我很难使用带有Typescript的外部库。我非常想为没有类型可用的库添加自定义类型,而我在理解如何导入以及如何使用类型方面很费劲。

有什么区别,以及在以下情况下对应的键入如何查找:

import something = require('something');

import * as something from 'something';

const something = require('something');

import {something} from 'something';

伊凡·兹拉捷夫(Ivan Zlatev)

require是导入外部模块的“老方法”,import语法是当前推荐的与ES6语法一致的方法。根据TypeScript中module配置,tsconfig.json此语法将转换为相关的模块类型/样式。

如果您想了解TypeScript如何解析外部模块(它支持两种模式,node并且classic-可在tsconfig.jsonas中配置moduleResolution),请阅读以下文档:http : //www.typescriptlang.org/docs/handbook/module-resolution.html主要区别在于如何解决非相对模块路径。

如果您想了解TypeScript如何以及在何处查找类型(类型声明),请阅读此博客文章:http : //ivanz.com/2016/06/07/how-does-typescript-discover-type-declarations -definitions-javascript /从博客-它会:

  1. 尝试在module.d.ts旁边module.js输入自定义代码
  2. 尝试检查typings:inpackages.json节点模块(in node_modules
  3. 尝试在存在declare module X的文件捆绑中查找所有环境声明(语法)tsconfig.json这很重要,因为该文件的存在使TypeScript将所有包含的文件作为单个“项目” /“工作区”处理
  4. 寻找三斜线注释/// <reference path="path/to/declarations.d.ts" />-考虑到tsconfig.json可以使用项目文件,我不再建议这样做

您还可以输入两种类型:

  1. 外部模块分型-现场旁边的文件或节点模块的情况下对他们的路径中存在typings:project.json语法export X没有模块声明(文件是模块!)。考虑它们被“绑定”到代码文件中,以及诸如“这是该模块的外观”之类的东西

  2. 环境类型-可以在任何地方居住。语法为declare module X考虑“某处存在类型/模块X,这就是它的样子”。对于模块,TypeScript将根据模块名称进行匹配。其他用例是全局变量(例如jQuery $)。

有关如何配置以及如何配置的文档,请tsconfig.json阅读此处:https : //github.com/Microsoft/TypeScript/wiki/tsconfig.json

关于您提供的不同示例-假设您有一个名为的模块moduleA要注意的一件事是,文件是JS / TS世界中的一个模块,因此:

模组

export class Car
{
    public model: string = "";
}

moduleA.js-已编译(目标ES5和模块类型CommonJS)

"use strict";
var Car = (function () {
    function Car() {
        this.model = "";
    }
    return Car;
}());
exports.Car = Car;

主要

import moduleA = require("./moduleA");

new moduleA.Car();

// equivalent to the above - import everything under myModuleName
import * as myModuleName from './moduleA';

new myModuleName.Car();

// import only the Car class
import {Car} from './moduleA'

new Car();

// import only the Car class and alias it as MyCar
import {Car as MyCar} from './moduleA'

new MyCar();

main.js-已编译(目标ES5和模块类型CommonJS)

"use strict";
var moduleA = require("./moduleA");
new moduleA.Car();

// equivalent to the above - import everything under myModuleName
var myModuleName = require('./moduleA');
new myModuleName.Car();

// import only the Car class
var moduleA_1 = require('./moduleA');
new moduleA_1.Car();

// import only the Car class and alias it as MyCar
var moduleA_2 = require('./moduleA');
new moduleA_2.Car();

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

导入material-ui组件的不同方式之间有什么区别?

导入 Python 小部件的两种不同方式有什么区别?

启动线程的不同方式有什么区别?

实现INotifyPropertyChanged的不同方式之间有什么区别?

* .d.ts和* .ts在打字稿中有什么区别?

在打字稿中,这两种索引签名类型有什么区别?

在打字稿中导入html模板

在打字稿中导入 JSON 文件

在打字稿中导入SVG图像

如何使用打字稿在Web-Worker中导入库

颤振以不同方式创建状态有什么区别?

加载打字稿模块依赖项的三种方式之间有什么区别?

在打字稿中声明函数类型的不同方法?

如何在打字稿文件中导入没有定义文件的js库

打字稿中的Never和void有什么区别?

打字稿中的枚举和对象有什么区别

打字稿中any []和[]有什么区别

是否可以在打字稿中导入通用诺言?

如何在打字稿中导入嵌套接口

在打字稿中导入 hashids 时出现异常

如何在打字稿中导入类型?

在打字稿中导入JavaScript库时出错

如何在打字稿中导入js文件?

在打字稿中导入json文件会导致有效json出现“意外令牌”错误

为什么有不同的方式在JavaScript中导入模块?

这些用 Webpack 导入模块的方式有什么区别?

为什么在打字稿中有2种不同的转换语法?

在Dart中导入整个文件与只导入带show的类之间有什么区别?

将JavaScript代码放入<a>的不同方法之间有什么区别?