How to import moment types definitions

Question

I have made an angular 1 project with typescript using this yeoman generator: https://github.com/FountainJS/generator-fountain-systemjs
It uses SystemJS and jspm to get dependencies but npm for type definitions (using DefinitelyTyped repository).

I have been struggling these last few days trying to import moment type definitions. I have installed moment using jspm, and i have discovered that it comes with its own type definitions, so if you call the command npm install @types/moment --save-dev you only get a stub and a deprecation warning

This is a stub types definition for Moment (https://github.com/moment/moment). Moment provides its own type definitions, so you don't need @types/moment installed!

Now, i don't know if it's my editor, project or typescript settings or really a typescript issue, but i can't seem to be able to properly import moment's type definitions.

if i do either import moment from 'moment'; or import * as moment from 'moment'; i get this error on my editor (atom with atom-typescript, but i have the same error on Visual Studio Code) Cannot find module 'moment'.

Despite this error, when i build my application it works fine (calling moment functions works).

I have tried a lot of solutions i found on the internet (apparently, importing type definitions from moment is a common issue) but none worked. Yesterday I managed to make it work by manually creating the directory moment inside node_modules/@types and put moment.d.ts inside it (i had to rename it index.d.ts though).

Since i didn't really like this solution, i wanted to at least create a types folder i could put stuff into without having to modify node_modules structure. So i created a folder custom-types and put the moment folder with types definitions there, then added custom-types into tsconfig.json, i thought this would've worked fine but actually the error reappeared...

Now i'm out of ideas, and i don't really know what else to try.

This is my current tsconfig.json (in the last attempt to make things work i have added the custom-types folder with different paths, although it's on the same level as the node_modules folder and tsconfig.json file)

{
    "compilerOptions": {
        "sourceMap": true,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "removeComments": false,
        "noImplicitAny": false,
        "module": "system",
        "target": "es5",
        "moduleResolution": "classic",
        "typeRoots": [
            "node_modules/@types/",
            "./custom-types/",
            "custom-types/",
            "../custom-types/",
            "../../custom-types/",
            "../../../custom-types/"
        ],
        "types": [
            "angular-ui-router",
            "angular",
            "angular-mocks",
            "jquery",
            "jasmine",
            "moment",
            "es6-shim"
        ]
    },
    "compileOnSave": false,
    "filesGlob": [
        "custom-types/**/*.ts",
        "src/**/*.ts",
        "src/**/*.tsx",
        "!jspm_packages/**",
        "!node_modules/**"
    ]
}

Answer 1

I've been using moment in TypeScript (IntelliJ) with no extra work to install typings for it.

Here's the relevant configuration:

• Inside tsconfig.json:
  • "moduleResolution": "Node"
  • No "types" section at all
• ./package.json has no @types/moment
• Inside ./node_modules/moment/:
  • ./moment.d.ts exists
  • ./package.json has "typings": "./moment.d.ts"
  • ./package.json is "version": "2.14.1"

When I switch back to "moduleResolution": "Classic", TypeScript says cannot find module 'moment'. So that is probably the culprit.