An open API service indexing awesome lists of open source software.

https://github.com/nicolaspadari/nuxt-datefns-module

date-fns integration for Nuxt
https://github.com/nicolaspadari/nuxt-datefns-module

Last synced: about 1 month ago
JSON representation

date-fns integration for Nuxt

Awesome Lists containing this project

README

          

# 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

Local development

```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
```

[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