vuetifyjs/vuetify · error · Error

[${v}] cannot be parsed into date format specification

Error message

[${v}] cannot be parsed into date format specification

What it means

Thrown by DateFormatSpec.parse() when canBeParsed(v) is false. canBeParsed requires the value be a string that, lowercased, contains 'y', 'm', and 'd' AND contains one of '/', '-', '.' as a separator. This drives VDateInput / locale date-input format parsing.

Source

Thrown at packages/vuetify/src/composables/dateFormat.ts:38

  ) { }

  get format () {
    return this.order.split('')
      .map(sign => `${sign}${sign}`)
      .join(this.separator)
      .replace('yy', 'yyyy')
  }

  static canBeParsed (v: any) {
    if (typeof v !== 'string') return false
    const lowercase = v.toLowerCase()
    return ['y', 'm', 'd'].every(sign => lowercase.includes(sign)) &&
      ['/', '-', '.'].some(sign => v.includes(sign))
  }

  static parse (v: string) {
    if (!DateFormatSpec.canBeParsed(v)) {
      throw new Error(`[${v}] cannot be parsed into date format specification`)
    }
    const order = v.toLowerCase().split('')
      .filter((c, i, all) => 'dmy'.includes(c) && all.indexOf(c) === i)
      .join('')
    const separator = ['/', '-', '.'].find(sign => v.includes(sign))!
    return new DateFormatSpec(order, separator)
  }
}

export const makeDateFormatProps = propsFactory({
  inputFormat: {
    type: String,
    validator: (v: string) => !v || DateFormatSpec.canBeParsed(v),
  },
}, 'date-format')

export function useDateFormat (props: DateFormatProps, locale: Ref<string>) {
  const adapter = useDate()

View on GitHub (pinned to 8d153908df)

Solutions

1. Use a separator-delimited format containing y, m, and d (e.g. 'yyyy-MM-dd', 'dd/MM/yyyy', 'MM.dd.yyyy').
2. If you only have an ISO string, omit inputFormat and let the component use the default.
3. Pre-check with DateFormatSpec.canBeParsed(value) before assigning inputFormat.

Example fix

// before
<VDateInput input-format="YYYY" />
// or
<VDateInput input-format="DD MMM YYYY" />

// after
<VDateInput input-format="yyyy-MM-dd" />

import { DateFormatSpec } from 'vuetify/composables/dateFormat'

function safeInputFormat(fmt: string): string {
  if (!DateFormatSpec.canBeParsed(fmt)) {
    throw new TypeError(`inputFormat '${fmt}' must contain y/m/d and a /,-,or . separator`)
  }
  return fmt
}

import { DateFormatSpec } from 'vuetify/composables/dateFormat'
function isParsableFormat(v: unknown): v is string {
  return typeof v === 'string' && DateFormatSpec.canBeParsed(v)
}

try {
  DateFormatSpec.parse(maybeFmt)
} catch (e) {
  if (e instanceof Error && /cannot be parsed into date format/.test(e.message)) {
    fmt = 'yyyy-MM-dd' // safe default
  } else throw e
}

When it happens

Trigger: Passing an `inputFormat` like 'YYYY' (missing m/d), 'YYYYMMDD' (no separator), 'MM-DD' (missing y), a non-string, or a format using unsupported separators (e.g. 'YYYY MM DD' with a space).

Common situations: Setting the `input-format` prop on VDateInput to an ISO-style 'YYYY-MM-DD' is fine, but locale strings like 'DD MMM YYYY', formats with words, or missing components fail. Also triggered by passing dayjs/date-fns tokens verbatim.

Related errors

• ${input} is not a valid timestamp. It must be a Date, number
• Unrecognized pagination target ${pageBy}
• [Vuetify] Could not find injected date options
• Easing function "${options.easing}" not found.
• [Vuetify] Could not find injected locale instance

AI-assisted analysis of vuetifyjs/vuetify@8d153908df (2026-08-12). Data as JSON: /api/errors/40e3d0d370a9a457. Report an issue: GitHub.