dayjs: TypeError: dayjs_1.default is not a function

When updating the dayjs package from 1.8.0 to 1.8.3, I’m getting this error.

I changed my import from import * as dayjs from 'dayjs'; to import dayjs from 'dayjs'; which let me compile, but this error what this result.

Here is the line of code for the error:

const today = dayjs().format('YYYY-MM-DD');

About this issue

  • Original URL
  • State: closed
  • Created 5 years ago
  • Reactions: 6
  • Comments: 44 (9 by maintainers)

Commits related to this issue

Most upvoted comments

Seems add "esModuleInterop": true, to tsconfig would solve this issue, but should a better way.

Just released v1.8.4 to revert this change. Please remain using

import * as dayjs from 'dayjs'

in a TypeScript project.

And discussion still welcome

@iamkun I figured it out, it was because I imported the “relativeTime” extension in my entry point but didn’t import it where I was using it. I just assumed that it would work at the entry point but moving it right next to the code in question fixed it:

import dayjs from "dayjs"
import relativeTime from "dayjs/plugin/relativeTime"

dayjs.extend(relativeTime)

console.log(dayjs(new Date("jan 1, 2020").fromNow())

This exception is still thrown, when you use dayjs in tests triggered by Jest you get it sometimes even tho the app in real-time works perfectly.

Weird issue

This works for me when I export the plugins along with the default.

// dayjs.ts
import dayjs from 'dayjs';
import utc from 'dayjs/plugin/utc';
import isTomorrow from 'dayjs/plugin/isToday';
import isToday from 'dayjs/plugin/isTomorrow';
import relativeTime from 'dayjs/plugin/relativeTime';

dayjs.extend(utc);
dayjs.extend(isToday);
dayjs.extend(isTomorrow);
dayjs.extend(relativeTime);

export {
  dayjs, 
  utc, isToday, isTomorrow, relativeTime, // important to not get compiling errors when using these plugins
};

This then works in another file

// anotherFile.js
import { dayjs } from './dayjs';
dayjs.utc();

This repo feels forsaken.

My jest tests are failing because its is unable to recognize dayjs

image

In the file , i have used dayjs like this -

import * as dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';

dayjs.extend(relativeTime);

Only the tests are failing , functionality is working fine.

same

@iamkun Why this issue closed?

Can I put a bounty on this bug ? I set it to 100$

  • PR must be accepted by @iamkun
  • Both import dayjs from 'dayjs' and import * as dayjs from 'dayjs' must work
  • TypeError should be resolved (see #1132)

Ahh actually it was a bit more complicated I’m realizing then what I wrote. Basically when you have a library compiling with tsconfig allowSyntheticDefaultImports and then a consuming application that does not use that setting, we got that error. Both the library and consuming application had dayjs as dependencies. Using TS 3.0.3 and dayjs 1.8.9.

I think I may write this all up in a separate issue, but I think a root cause to this is when using tsconfig allowSyntheticDefaultImports you have to then change how you import dayjs from import * as dayjs from 'dayjs'; to import dayjs from 'dayjs'; .

Looks like adding export as namespace dayjs; to the .d.ts file could would allow you to import dayjs both ways. Seems like what React and other libraries do. This allows for importing dayjs the same way regardless of if you have that tsconfig variable set.

TypeError: dayjs is not a function when running test from react-test-library.

I’m still getting the same error in end of 2021. Any new ideas?

Yes, I moved to Luxon, bigger package size but at least it doesn’t f*** up my tests.

My jest tests are failing because its is unable to recognize dayjs

image

In the file , i have used dayjs like this -

import * as dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime';

dayjs.extend(relativeTime);

Only the tests are failing , functionality is working fine.

Seems add "esModuleInterop": true, to tsconfig would solve this issue, but should a better way. nice

The error that I see on VSCode when using import * as dayjs from "dayjs" is:

Type 'typeof import("/project/node_modules/dayjs/index.d.ts")' has no call signatures.
import * as dayjs from "dayjs"

export function createDayString(time: string): string {
  return dayjs().to(dayjs(time))
}
Screen Shot 2022-11-14 at 21 09 14

Any update on fixing this? I’m working in a JS React Native project. This is really quite frustrating.

 FAIL  src/utils/__tests__/isDateSameOrAfter.test.js
  isDateSameOrAfter()
    when the date string passed as a param, is BEFORE today's date
      ✕ isDateSameOrAfter() return false (1 ms)

    TypeError: t is not a function

       9 |
      10 | export const isDateSameOrAfter = (date) => {
    > 11 |     dayjs.extend(isSameOrAfter);
         |           ^
      12 |     return dayjs().isSameOrAfter(date);
      13 | };
      14 |

      at Function.extend (node_modules/dayjs/dayjs.min.js:1:6551)
      at isDateSameOrAfter (src/utils/day-js/isDateSameOrAfter.js:11:11)
      at Object.<anonymous> (src/utils/__tests__/isDateSameOrAfter.test.js:10:45)

Test Suites: 1 failed, 1 total
Tests:       1 failed, 1 total
Snapshots:   0 total
Time:        1.139 s

Using default imports

import dayjs from 'dayjs'
import relativeTime from 'dayjs/plugin/relativeTime'

in the tested module instead import * as ... did the trick for me.

I have tried all the suggestions in this thread. Warning to anyone trying to publish a typescript npm package artifact in azure with this. It works like a charm in the artifact repo, but once distributed to your development-repo it just wont work anymore. Just use a different library.

Facing similar issue

My code is

import dayjs from 'dayjs';

const createdAt = dayjs.utc(review.createdDt || '')
TypeError: dayjs__WEBPACK_IMPORTED_MODULE_1__.utc is not a function

tsconfig is already had allowSyntheticDefaultImports: true

dayjs version 1.10.4

I was facing this issue as well. I added allowSyntheticDefaultImports: true in tsconfig.json & import dayjs from 'dayjs' worked for me.

I also saw this issue when tsconfig had this set "allowSyntheticDefaultImports": true,.