如果我的网站已经在使用moment.min.js,如何使用Moment.js TypeScript定义文件？

Question

我正在转换网站以使用TypeScript,我只是将许多JavaScript文件中的一个转换为TypeScript.我网站的所有页面都引用了moment.js,例如:

<script src="/scripts/moment.min.js"></script>

我使用以下命令添加了其他TypeScript定义文件:

npm install --save-dev @types/jquery

......但是,以上似乎是错误的选择.当我使用上面的命令(但将'moment'替换为'jquery')时,会下载一个自述文件,说明:

这是Moment的存根类型定义(https://github.com/moment/moment).Moment提供了自己的类型定义,因此您不需要安装@ types/moment!

作为解决方案,我尝试从其GitHub存储库中保存moment.d.ts文件并在TypeScript文件中引用它,如下所示:

///<reference path="../../Scripts/typeDeclarations/moment.d.ts"/>
var now:any = moment.utc();

但是,TypeScript给了我警告:

找不到名字'时刻'

Answer 1

TL; DR;

从github网站开始添加项目中的moment.d.ts(链接)并注释掉最后一行

 //export = moment;

我已经创建了一个迷你测试项目来证明这一点,这对我有用.

项目结构

--
  |
  -typings/
     -moment/
       -moment.d.ts   <-- //export = moment; commented out
  -typescript/
     -main.ts
  -tsconfig.json

两者的内容typings和typescript有编译目标的一部分,即不排除tsconfig.json它看起来像这样

{
    "compilerOptions": {
        "target": "es5",
        "declaration": false,
        "noImplicitAny": true,
        "removeComments": true,
        "outDir": "dist",
        "jsx": "react",
        "sourceMap": true,
        "experimentalDecorators": true
    },
    "compileOnSave": true,
    "exclude": [
        "node_modules",
        "dist"
    ]
}

该main.ts文件包含

const now: moment.Moment = moment.utc();

并编译......正如预期的那样,我的IDE让我从定义文件中自动完成.(不需要///<reference标签 - 你应该避免使用它们)

删除export定义文件末尾的语句,将其"转换"为内部 - 但全局 - 模块声明文件.

Answer 2

一种方法是创建自定义类型,例如custom-typings/moment.d.ts:

export * from 'moment'
export as namespace moment

并在您的包含该文件夹tsconfig.json:

{
  include: [
    "custom-typings"
  ]
}

Answer 3

不幸的是,momentjs类型声明是用纯模块化语法编写的.这是因为现在很多人使用npm来获取js包,然后使用模块加载器(如Webpack或Browserify)以可用于浏览器的格式捆绑npm模块.

在您的情况下,您不使用模块,而只是依赖于在全局上下文中导入浏览器脚本.为了支持这一点,定义文件的作者应该遵循UMD指南定义,这是一种编写定义的方式,以便它们支持模块化和全局环境使用.

幸运的是,您可以非常轻松地将其添加到定义副本中.只需将以下行添加到顶部即可moment.d.ts

export as namespace moment;

这样做基本上就是说当你moment.d.ts使用tripple-slash指令进行引用时,它会使名称为'moment'的全局命名空间中从模块导出的所有内容都可用.

这意味着现在应该moment可以在全局上下文中访问全局变量,您不应再看到Cannot find the name 'moment'错误.

这应该是你需要做的.