How to use with TypeScript

[afr1983]

I am using js-joda in Typescript, however I need the timezone support provided by this extension. How do I use it with Typescript?

[pithu]

Hello @afr1983

well i am not a typescript user but i would guess its the same as for es6

import { use as jsJodaUse, ZonedDateTime } from 'js-joda'
import jsJodaTimeZone from 'js-joda-timezone'

jsJodaUse(jsJodaTimeZone)

const zdt = ZonedDateTime.now()

Does this help ?

[ianp]

It's a bit of a mess because js-joda wants to play silly dynamic tricks with require and TypeScript really doesn't like this, so you have to import the types that you are using and require the timezone module separately, like this:

import {LocalDate, ZonedDateTime} from 'js-joda'
const joda = require('js-joda').use(require('js-joda-timezone'))

const getDate = (s: string): LocalDate => {
  // ...
  return LocalDate.of(year, month, day)
}

Note that this will mess up autocompletion in most/all IDEs, so you may want to comment out the .use(…) portion of that require chain while you are editing code.

Note that if you do want to import all of the types and use them prefixed then you need to use import * as … because there is no default export.

[afr1983]

@ianp That did the trick, thanks! I was trying to figure out how to import AND use in the same line, would never work.

[pithu]

Unfortunately we are using the babel@5 behavior for exporting a single default. So as far as i know you have to stick to the require trick for now.

import { use, ZonedDateTime, ZoneId} from 'js-joda'

use(require('js-joda-timezone'));

const zdt = ZonedDateTime.now(ZoneId.of('America/New_York'))

BTW: The use method is missing in the js-joda typescript definition. I will add it in the next release js-joda@1.5.1.

[Dyktus]

@pithu Sorry for opening this topic again but it would be good to add your last post to README.md because it took me some time to find this solution :)

[pithu]

Hi @Dyktus

thanks for reporting, well i guess you are right and we should document it and it would be nice to get rid of the require hack.,

I played around a bit with typescript, one possible solution could be to change the export of js-joda-timezone (and all other js-joda-plugins) to a named export. So the code would look like:

import { use, ZonedDateTime, ZoneId } from 'js-joda'
import { plug } from 'js-joda-timezone';

use(plug)

const zdt = ZonedDateTime.now(ZoneId.of('America/New_York'))

Another solution could be to move the plugin setup into the plugin internal code and hide from the code using it. I have the feeling that most coders are confused from the plugin solution anyway. so code could simply look like:

import { ZonedDateTime, ZoneId } from 'js-joda'
import 'js-joda-timezone';

const zdt = ZonedDateTime.now(ZoneId.of('America/New_York'))

not sure if that works but i will try it out.

[pithu]

Ok, i checked both approaches, both are working.

I vote for the later, because its more convenient. @phueper what is your opinion ?

[phueper]

I like the second approach much better as well...

Maybe, even nicer would be something like this, if possible:

import  { ZonedDateTime, ZoneId } from  'js-joda-timezone';

const zdt = ZonedDateTime.now(ZoneId.of('America/New_York'))

That would keep users from having to import joda and the plugin separately ... i don't know if this can work, but it would be nice... also for plugins like -extra that add new classes to the export maybe?

[pithu]

Great idea, but i am not sure how could make it. js-joda-timezone is injecting the ZoneRulesProvider and exporting nothing. So i would have to somehow export all classes and typescript definitions from js-joda here again.

Might be interesting to think about for later, for now i just take the simple way.

[pithu]

I just pushed the new version @1.3.0. With that version the use(plug) thingy is not required anymore, so it should work fine with typescript.

btw: in the repo https://github.com/js-joda/js-joda-examples.git you can find some examples how to use js-joda together with js-joda-timezone. There is also a typescript example.