Vite Plugin Dayjs

1.0.2 verified Mon Apr 27 auth: no javascript

Vite plugin that automatically converts Day.js CommonJS imports to ESM format for better tree-shaking and smaller bundle sizes. Current version 1.0.2 ships TypeScript types and works with all Day.js plugins and locales. Unlike manual import rewriting, this plugin provides zero-config conversion of dayjs, dayjs/plugin/*, and dayjs/locale/* imports to their ESM counterparts (dayjs/esm/...). It addresses the common footgun where Day.js CJS modules cannot be tree-shaken in Vite builds, leading to larger bundles. The plugin is maintained as part of the antdv-next ecosystem.

Common errors

error Cannot find module 'dayjs/esm' or its corresponding type declarations. ↓

cause The plugin redirects imports to dayjs/esm, but dayjs may not be installed or does not provide ESM exports in its package.json.

fix

Install dayjs: npm install dayjs. Ensure dayjs version is >=1.8 which includes ESM support.

error [vite] Internal server error: Failed to resolve import "dayjs/esm/plugin/relativeTime" from "src/main.ts". Does the file exist? ↓

cause Importing a plugin that does not exist in dayjs or a typo in the plugin name.

fix

Check available plugins at https://day.js.org/docs/en/plugin/plugin and use the correct name (e.g., 'relativeTime' not 'relativetime').

error [vite] Internal server error: Plugin 'vite-plugin-dayjs' returned code when not called as a function. ↓

cause The plugin was not properly invoked as a function: e.g., used as vitePluginDayjs instead of vitePluginDayjs().

fix

Ensure the plugin is called: import vitePluginDayjs from 'vite-plugin-dayjs'; plugins: [vitePluginDayjs()].

Warnings

gotcha Plugin only works with Vite; not compatible with other bundlers like Webpack, Rollup, or esbuild standalone. ↓

fix Use Vite as your build tool if you want to use this plugin.

deprecated Zero-config design means no customization: all dayjs imports are redirected to ESM. If you need selective conversion, this plugin may not fit. ↓

fix For custom import handling, consider using vite-plugin-optimizer or patch-package with manual aliasing.

gotcha If dayjs is also imported from a dependency that uses CJS directly (not via import), those imports will not be converted. ↓

fix Ensure all dayjs usage in your source code uses import statements; consider using optimizeDeps to pre-bundle dependent CJS packages.

Install

npm install vite-plugin-dayjs

yarn add vite-plugin-dayjs

pnpm add vite-plugin-dayjs

Imports

vitePluginDayjs

wrong

import { vitePluginDayjs } from 'vite-plugin-dayjs'

correct

import vitePluginDayjs from 'vite-plugin-dayjs'

This is a default export; named import does not exist.

dayjs
wrong
```
import dayjs from 'dayjs/esm'
```
correct
```
import dayjs from 'dayjs'
```
The plugin converts 'dayjs' to 'dayjs/esm' automatically; manual import to 'dayjs/esm' defeats the plugin's purpose and may cause duplicate module instances.
plugin import
wrong
```
import relativeTime from 'dayjs/esm/plugin/relativeTime'
```
correct
```
import relativeTime from 'dayjs/plugin/relativeTime'
```
Import plugins without the /esm prefix; the plugin handles the conversion. If you manually use /esm, tree-shaking may still work but you bypass the intended workflow.
locale import
wrong
```
import 'dayjs/esm/locale/zh-cn'
```
correct
```
import 'dayjs/locale/zh-cn'
```
Import locales without the /esm prefix; let the plugin rewrite them to ESM.

Quickstart

Configures vite-plugin-dayjs in vite.config.ts and demonstrates automatic ESM conversion of dayjs, plugin, and locale imports.

// vite.config.ts
import { defineConfig } from 'vite'
import vitePluginDayjs from 'vite-plugin-dayjs'

export default defineConfig({
  plugins: [
    vitePluginDayjs(),
  ],
})

// Then in your source files:
import dayjs from 'dayjs'
import relativeTime from 'dayjs/plugin/relativeTime'
import 'dayjs/locale/zh-cn'

dayjs.extend(relativeTime)
dayjs.locale('zh-cn')

console.log(dayjs().format('YYYY-MM-DD'))
console.log(dayjs().subtract(1, 'day').fromNow())