Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/nuxt-community/dayjs-module
Day.js module for your Nuxt 2 project.
https://github.com/nuxt-community/dayjs-module
dayjs nuxt nuxt-module nuxtjs vue
Last synced: about 3 hours ago
JSON representation
Day.js module for your Nuxt 2 project.
- Host: GitHub
- URL: https://github.com/nuxt-community/dayjs-module
- Owner: nuxt-community
- License: mit
- Created: 2019-03-07T15:04:41.000Z (over 5 years ago)
- Default Branch: master
- Last Pushed: 2024-04-11T20:36:48.000Z (6 months ago)
- Last Synced: 2024-04-14T05:10:22.430Z (5 months ago)
- Topics: dayjs, nuxt, nuxt-module, nuxtjs, vue
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/@nuxtjs/dayjs
- Size: 2.68 MB
- Stars: 260
- Watchers: 4
- Forks: 16
- Open Issues: 27
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# @nuxtjs/dayjs
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)
[![donate: Patreon](https://img.shields.io/badge/donate-patreon-orange.svg?style=flat-square)](https://www.patreon.com/potato4d)
[![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg?style=flat-square)](https://opensource.org/licenses/MIT)
[![NPM version](https://img.shields.io/npm/v/@nuxtjs/dayjs.svg?style=flat-square)](https://npmjs.com/package/@nuxtjs/dayjs)
[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg?style=flat-square)](#contributors)
[![NPM downloads](https://img.shields.io/npm/dm/@nuxtjs/dayjs.svg?style=flat)](https://npmjs.com/package/@nuxtjs/dayjs)
[![codecov](https://codecov.io/gh/nuxt-community/dayjs-module/branch/master/graph/badge.svg)](https://codecov.io/gh/nuxt-community/dayjs-module)> The best way to use Day.js easily in your Nuxt 2 project.
Looking for a Nuxt 3 alternative? Try out:
- https://github.com/nathanchase/dayjs
- https://github.com/fumeapp/dayjs## Installation
```bash
$ yarn add @nuxtjs/dayjs # or npm install
```## Usage
### 1. Register dayjs module to your Nuxt Application
```js
export default {
// ...
modules: [
'@nuxtjs/dayjs'
],// Optional
dayjs: {
locales: ['en', 'ja'],
defaultLocale: 'en',
defaultTimeZone: 'Asia/Tokyo',
plugins: [
'utc', // import 'dayjs/plugin/utc'
'timezone' // import 'dayjs/plugin/timezone'
] // Your Day.js plugin
}
// ...
}
```### 2. Use $dayjs on Context, Vue instance
with Context
```html
export default {
asyncData({ $dayjs }) {
return {
now: $dayjs().format('YYYY/MM/DD')
}
}
}```
with Vue instance
```html
export default {
data() {
return {
latestClicked: null
}
},
methods: {
handleClickButton() {
this.latestClicked = this.$dayjs().format('YYYY/MM/DD')
}
}
}```
### For Typescript users
Add the types to your `"types"` array in `tsconfig.json` after the `@nuxt/types` entry.
For dayjs plugins, add their relative types like `dayjs/plugin/_pluginName_`.
#### tsconfig.json
```json
{
"compilerOptions": {
"types": [
"@nuxt/types",
"@nuxtjs/dayjs",
"dayjs/plugin/relativeTime",
]
}
}
```## Development
```bash
$ git clone https://github.com/nuxt-community/dayjs-module.git
$ cd @nuxtjs/dayjs
$ yarn
```## License
MIT @potato4d
## Note
This project generated by [create-nuxt-module](https://github.com/potato4d/create-nuxt-module)
## Contributors
Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):
Takuma HANATANI(@potato4d)
💻 🐛 📖 💡 💬 👀
Bryan Daniel Velastegui Lucero
💻
Wei
💻
かずえもん
📖
Daiki Ojima
💻
This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!