# Nuxt Date Fns

[![npm version][npm-version-src]][npm-version-href]
[![npm downloads][npm-downloads-src]][npm-downloads-href]
[![License][license-src]][license-href]
[![Nuxt][nuxt-src]][nuxt-href]

Nuxt module for [date-fns](https://www.npmjs.com/package/date-fns)

## Features

- Auto import date-fns utilities
- Powered by TypeScript

## Quick Setup

Install the module to your Nuxt application with one command:

```bash
npx nuxi module add nuxt-datefns-module
```

That's it! You can now use Nuxt Datefns in your Nuxt app ✨

## Usage

Just refer to the [official documentation](https://date-fns.org/docs/Getting-Started). Instead of importing utilities manually, simply use the functions prefixed with "use", for example:

- format -> useFormat
- isAfter -> useIsAfter

Component prefix in customizable in the nuxt config, by creating a custom configuration:

```ts
// nuxt.config.ts

export default defineNuxtConfig({
	modules: ["nuxt-datefns-module"],
	"date-fns": {
		prefix: "foo" // useFormat -> fooFormat
	}
	// ...
});
```

Find out an example in the [playground](https://github.com/NicolaSpadari/nuxt-datefns-module/blob/main/playground/app.vue)

## Contribution

<details>
  <summary>Local development</summary>

  ```bash
  # Install dependencies
  bun install

  # Generate type stubs
  bun run dev:prepare

  # Develop with the playground
  bun run dev

  # Build the playground
  bun run dev:build

  # Run ESLint
  bun run lint

  # Release new version
  bun run release
  ```

</details>

[npm-version-src]: https://img.shields.io/npm/v/nuxt-datefns-module/latest.svg?style=flat&colorA=002E3B&colorB=00DC82
[npm-version-href]: https://npmjs.com/package/nuxt-datefns-module

[npm-downloads-src]: https://img.shields.io/npm/dm/nuxt-datefns-module.svg?style=flat&colorA=002E3B&colorB=00DC82
[npm-downloads-href]: https://npm.chart.dev/nuxt-datefns-module

[license-src]: https://img.shields.io/npm/l/nuxt-datefns-module.svg?style=flat&colorA=002E3B&colorB=00DC82
[license-href]: https://npmjs.com/package/nuxt-datefns-module

[nuxt-src]: https://img.shields.io/badge/Nuxt%204%20ready-002E3B?logo=nuxt&logoColor=#00DC82
[nuxt-href]: https://nuxt.com