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（link），注释最后一行

 //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指南定义，这是一种编写定义的方式，以便它们支持模块化和全局环境使用。

幸运的是，您可以非常轻松地将其添加到定义副本中。只需将以下行添加到# With reordering d$x <- reorder(d$x, -d$y) ggplot(d, aes(x, y)) + geom_col()

的顶部即可

moment.d.ts

这样做基本上就是说当你使用tripple-slash指令引用export as namespace moment;时，它会使名称为'moment'的全局命名空间中从模块导出的所有内容都可用。

这意味着现在应该可以在全局上下文中访问全局moment.d.ts变量，您不应再看到moment错误。

这应该是你需要做的全部。

Answer 4

从版本2.13.0开始，Moment包含一个打字稿定义文件。因此，如果您使用的是此版本，则可以执行以下操作：

import * as moment from 'moment';


let now = moment().format('LLLL');

注意：如果您在导入片刻时遇到问题，请尝试在"allowSyntheticDefaultImports": true文件的compilerOptions中添加tsconfig.json。

如需参考，请访问官方doc。

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

4 个答案: