README.md

vue-date-tools

VueJS Date Components based on the date-fns library

Click Here to Try the Live Demo

Best features:

Lightweight and almost no dependencies

No dependencies other than the lightweight date-fns library! All other VueJS compatible datepickers I could find until now used JQuery, Bootstrap, and Moment JS. Vue Date Tools is the best starting point for performance in Date components.

Subcomponents are exposed for maximum flexibility

Mix and match sub-components such as the RangeSelector or the NumberIncrement to create your own VueJS datepicker that matches your specific requirements!

Easy to customize and style

VueJS date component libraries that present themselves as "plug and play" are in my experience quite difficult to style and customize for a specific project. You can use the provided Example Date Components as is, but Vue Date Tools is more intended as a toolbox for date components where the hard parts have already been solved.

Bi-directional components for better user experience

Users also have the option to directly edit the date in the input to update the state.

Uses Javascript Native Date object under the hood.

Example Components:

VueJS DatePicker with Date and Time selection

VueJS DatePicker with Navigation arrows

DateRange Picker to select a duration

DateRange Picker with a list of prepared duration suggestions

Simple TimePicker to select a time

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.