Merge pull request #31 from GaborTorma/main

fix useDayjs types and add #dayjs alias

README.md

@@ -50,16 +50,29 @@ export default defineNuxtConfig({
 
 ## Basic Usage
 
-You can use the provided composables to access Day.js anywhere.
+You can use the provided `$dayjs` to access Day.js in template.
 
 ```vue
 <template>
   <div>
-    <time :datetime="$dayjs()('2023-01-01').utc().toString()"> {{ date }} </time>
+    <time :datetime="$dayjs('2023-01-01').utc().toString()"> {{ date }} </time>
   </div>
 </template>
 ```
 
+## Composables
+
+You can use the useDayjs composable to access Day.js anywhere.
+
+```js
+<script setup>
+  import { useDayjs } from '#dayjs' // not need if you are using auto import
+  const dayjs = useDayjs()
+  dayjs.locale('fr')
+  dayjs.extend(...)
+</script>
+```
+
 ## Configuration
 
 You can specify any amount of locales, plugins, set a default locale, and set a default timezone
@@ -76,7 +89,7 @@ export default defineNuxtConfig({
 })
 ```
 
-> By default we include the relativeTime and utc plugins, and always impport updateLocale
+> By default we include the relativeTime and utc plugins, and always import updateLocale
 
 ## External Plugins
 

package.json

@@ -13,7 +13,8 @@
       "types": "./dist/types.d.ts",
       "import": "./dist/module.mjs",
       "require": "./dist/module.cjs"
-    }
+    },
+    "./dist/runtime/composables/dayjs": "./dist/runtime/composables/dayjs.mjs"
   },
   "main": "./dist/module.cjs",
   "types": "./dist/types.d.ts",
@@ -51,4 +52,4 @@
     "nuxt": "^3.7.4",
     "vitest": "^0.34.6"
   }
-}
+}

playground/app.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useDayjs } from '../src/runtime/composables/dayjs';
+import { useDayjs } from '#dayjs';
 const dayjs = useDayjs()
 const card = false
 const icon = false

src/module.ts

@@ -108,10 +108,11 @@ export default defineNuxtModule<ModuleOptions>({
 
     addPlugin(resolver.resolve('./runtime/plugin'))
 
+		nuxt.options.alias["#dayjs"] = resolver.resolve("./runtime/composables/dayjs");
     addImports({
       name: 'useDayjs',
       as: 'useDayjs',
-      from: resolver.resolve('./runtime/composables/dayjs')
+      from: nuxt.options.alias["#dayjs"]
     })
 
     addTemplate({

src/runtime/composables/dayjs.d.ts

@@ -0,0 +1,3 @@
+import dayjs from '#build/dayjs.imports.mjs'
+
+export declare function useDayjs(): typeof dayjs

src/runtime/composables/dayjs.ts

@@ -1,7 +1,5 @@
-import { useNuxtApp } from '#app'
-import dayjs from '#build/dayjs.imports.mjs'
+import dayjs from '#build/dayjs.imports.mjs';
 
-export const useDayjs = (): typeof dayjs => {
-  const { $dayjs } = useNuxtApp()
-  return $dayjs
+export function useDayjs() {
+	return dayjs
 }