Property 'format' does not exist on type 'Duration'

Question

I'm trying to use "moment-duration-formation" in TypeScript but, even though it works, webpack keeps on complaining that it can't find the "format" method on the line:

return moment.duration(value, "minutes").format("...");

Here is the package.json

{
  "devDependencies": {
    "@types/moment-duration-format": "^1.3.7"
  },
  "dependencies": {
    "moment": "^2.18.1",
    "moment-duration-format": "^1.3.0"
  }
}

And the tsconfig.json:

{
  "compilerOptions": {
    "typeRoots": [ "./node_modules/@types" ]
  }
}

In the (angular2) component:

import * as moment from "moment";
import * as momentDurationFormat from "moment-duration-format";

...

let result: string = moment.duration(this.selectedHangarDistance * 10, "minutes").format("...")

I also tried with

import "moment-duration-format";

But it does not change anything:

ERROR in [at-loader] ./src/app/components/building/shop/shop.component.ts:190:81 TS2339: Property 'format' does not exist on type 'Duration'.

Epispastic

I'm not seeing the types for moment. Did you npm install --save-dev @types/moment? – Roslynrosmarin

I just installed them but they're totally empty (no .d.ts file) and the readme file states "Moment provides its own type definitions, so you don't need @types/moment installed!". – Epispastic

Better solutions is there here, this worked for me. #13263121 – Bolduc

Answer 1

A solution that worked for me:

import * as moment from "moment";
import momentDurationFormatSetup from "moment-duration-format";
momentDurationFormatSetup(moment);

The * as moment was significant as import moment from "moment" was causing type issues when being passed momentDurationFormatSetup.

Detoxify

Answer 2

Run yarn add --dev @types/moment-duration-format or npm install --save-dev @types/moment-duration-format

Puff