user3272018
user3272018

Reputation: 2419

Moment.js + TypeScript. Cannot find name moment

I develope web application with knockout in VisualStudio. I just installed knockout via bower, included d.ts file in project, included script to html page and now i can get access to ko.

Now i try to use moment.js. Like with knockout: install, include d.ts, include script to page and i get an error cannot find name 'moment'. Adding reference to d.ts does not help, import * as moment from 'moment' get an error can not find module moment.

I know that it's a stupid problem, but i can't fix it. What am i doing wrong?

Upvotes: 18

Views: 54077

Answers (9)

user8926681
user8926681

Reputation: 11

Declare below in the typings.d.ts file which needs to be created at the root level of the project.

declare module 'moment' {
    const moment: any;
    export = moment
}

Upvotes: 0

user13391764
user13391764

Reputation: 11

I have fixed it to add "allowSyntheticDefaultImports": true property in tsconfig.app.json file and remove "angularCompilerOptions": { "enableIvy": false}. also set below dependecy in package.json "moment": "^2.28.0", "ngx-daterangepicker-material": "4.0.1", "tslib": "^2.0.0",

Upvotes: 0

Juan Cruz
Juan Cruz

Reputation: 43

In angular you can do:

declare const moment: any;

after imports.

Upvotes: 0

Sylvio Menubarbe
Sylvio Menubarbe

Reputation: 94

For me, error comes from moment version 2.25.0. A workaround for the moment is to downgrade to 2.24.0.

In [email protected] - package.json :

"typesVersions": {
    ">=3.1": {
      "*": [
        "ts3.1-typings/*"
      ]
    }
  }

But folder 'ts3.1-typings' does not exist. If your typescript version is 3.1 or higher you'll have error :

Cannot find module 'moment'

Github issue : https://github.com/moment/moment/issues/5486

Upvotes: 4

Iosif Petre
Iosif Petre

Reputation: 188

I had the same error today. The fix was to downgrade the "moment" package from "2.25.0" to "2.22.1" in package.json

My application is an angular 8 version and "typescript": "3.5.3

Upvotes: 6

Sunitha Nagappa
Sunitha Nagappa

Reputation: 31

Try adding the below code, it worked for me

import * as MomentD from "node_modules/moment/moment.d";

Upvotes: 3

Samih
Samih

Reputation: 1088

This seems to solve the problem for me (the other solutions in this thread didn't work):

import * as moment from 'moment/moment.js';

I still seem to be getting the correct typescript definitions even referencing the js file directly. I suspect the reason is that the 'moment' folder under node_modules does not have an index.js file but I'm not a typescript typings/compiler expert.

Upvotes: 7

Raúl Otaño
Raúl Otaño

Reputation: 4760

In my case, finally get this error solved by doing the following:

  1. Adding this option "allowSyntheticDefaultImports": true, in the compilerOptions section of the tsconfig.json file (EDITED: As the moment doc. sais in the Note: If you have trouble importing moment, try add "allowSyntheticDefaultImports": true in compilerOptions in your tsconfig.json file.)
  2. Also add "moduleResolution": "node" in the same compilerOptions section. (Found this option looking around the web)
  3. Importing moment module like this import * as moment from 'moment';

Upvotes: 14

Balázs Édes
Balázs Édes

Reputation: 13807

What I'd recommend is using some tool for managing your definitions. Some popular options (you don't need both, just pick one):

  1. tsd - npm i -g tsd
  2. typings - npm i -g typings

These work in a similar fashion as package managers. You can install your definitions like npm/bower installs your dependencies.

Once you have one of these installed, go to your project and install moment + its definition

npm install moment --save

And one of these:

tsd install moment --save
typings install moment --save --ambient

Both of these will create a folder with your definitions in it (both call it typings), and both have an "umbrella" definition file in it, which you should reference in the entry point of your application (first is for tsd, second for typings):

/// <reference path="typings/tsd.d.ts" />
/// <reference path="typings/index.d.ts" />

After this is done, you can use moment (or any other module) as you would:

import * as moment from 'moment'
moment.isDate("I'm not a date")

I suggest checking out these:

https://github.com/DefinitelyTyped/tsd
https://github.com/typings/typings

Upvotes: 17

Related Questions