From 231e655119cf8b769c2cebd8ab23d47afdeb0e8a Mon Sep 17 00:00:00 2001 From: HomWang <516310460@qq.com> Date: Thu, 18 Aug 2022 19:18:25 +0800 Subject: [PATCH 1/7] Add Using plugins in plugins Using plugins in plugins --- .../2.guide/3.directory-structure/11.plugins.md | 12 ++++++++++++ 1 file changed, 12 insertions(+) diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md index b7676a54670..3b1c1998d86 100644 --- a/docs/content/2.guide/3.directory-structure/11.plugins.md +++ b/docs/content/2.guide/3.directory-structure/11.plugins.md @@ -39,6 +39,18 @@ export default defineNuxtPlugin(nuxtApp => { }) ``` +## Using plugins in plugins + +The only argument passed to a plugin is [`nuxtApp`](/api/composables/use-nuxt-app). + +```ts +export default defineNuxtPlugin((NuxtApp) => { + // https://v3.nuxtjs.org/guide/directory-structure/plugins#automatically-providing-helpers + // NuxtApp.$hello + return { test: 'test demo' } +}) +``` + ## Automatically Providing Helpers If you would like to provide a helper on the `NuxtApp` instance, return it from the plugin under a `provide` key. For example: From 5756f0b88478a5125ca7512bdc54e6ff0abe5eba Mon Sep 17 00:00:00 2001 From: HomWang <516310460@qq.com> Date: Thu, 18 Aug 2022 19:22:27 +0800 Subject: [PATCH 2/7] Add Using a composable in a plugin Using a composable in a plugin --- .../2.guide/3.directory-structure/11.plugins.md | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md index 3b1c1998d86..ff5f67141c9 100644 --- a/docs/content/2.guide/3.directory-structure/11.plugins.md +++ b/docs/content/2.guide/3.directory-structure/11.plugins.md @@ -41,8 +41,6 @@ export default defineNuxtPlugin(nuxtApp => { ## Using plugins in plugins -The only argument passed to a plugin is [`nuxtApp`](/api/composables/use-nuxt-app). - ```ts export default defineNuxtPlugin((NuxtApp) => { // https://v3.nuxtjs.org/guide/directory-structure/plugins#automatically-providing-helpers @@ -51,6 +49,18 @@ export default defineNuxtPlugin((NuxtApp) => { }) ``` +## Using a composable in a plugin + +```ts +export default defineNuxtPlugin((NuxtApp) => { + // https://v3.nuxtjs.org/guide/directory-structure/composables#example + const foo = useFoo() + return { test: foo } +}) +``` + +## Using plugins in plugins + ## Automatically Providing Helpers If you would like to provide a helper on the `NuxtApp` instance, return it from the plugin under a `provide` key. For example: From 1e15c3fa2798a599d4d15bdbc39190200eaa7598 Mon Sep 17 00:00:00 2001 From: HomWang <516310460@qq.com> Date: Thu, 18 Aug 2022 19:29:13 +0800 Subject: [PATCH 3/7] remove duplicate titles rm ## Using plugins in plugins --- docs/content/2.guide/3.directory-structure/11.plugins.md | 2 -- 1 file changed, 2 deletions(-) diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md index ff5f67141c9..ba334e15c22 100644 --- a/docs/content/2.guide/3.directory-structure/11.plugins.md +++ b/docs/content/2.guide/3.directory-structure/11.plugins.md @@ -59,8 +59,6 @@ export default defineNuxtPlugin((NuxtApp) => { }) ``` -## Using plugins in plugins - ## Automatically Providing Helpers If you would like to provide a helper on the `NuxtApp` instance, return it from the plugin under a `provide` key. For example: From ba97b8618270a61fdfd073cc840e47f962c1d98b Mon Sep 17 00:00:00 2001 From: pooya parsa Date: Mon, 22 Aug 2022 15:30:39 +0200 Subject: [PATCH 4/7] Update 11.plugins.md --- .../3.directory-structure/11.plugins.md | 21 ++++++++----------- 1 file changed, 9 insertions(+), 12 deletions(-) diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md index ba334e15c22..f80b63729f7 100644 --- a/docs/content/2.guide/3.directory-structure/11.plugins.md +++ b/docs/content/2.guide/3.directory-structure/11.plugins.md @@ -39,26 +39,23 @@ export default defineNuxtPlugin(nuxtApp => { }) ``` -## Using plugins in plugins +## Using Composables Within Plugins -```ts -export default defineNuxtPlugin((NuxtApp) => { - // https://v3.nuxtjs.org/guide/directory-structure/plugins#automatically-providing-helpers - // NuxtApp.$hello - return { test: 'test demo' } -}) -``` - -## Using a composable in a plugin +You can use auto-imports [composables](https://v3.nuxtjs.org/guide/directory-structure/composables#example) within Nuxt plugins: ```ts export default defineNuxtPlugin((NuxtApp) => { - // https://v3.nuxtjs.org/guide/directory-structure/composables#example const foo = useFoo() - return { test: foo } }) ``` +However, keep in mind there are some limitations and differences: + +- If a composable depends on another plugin that it registered later, it won't work. + - Reason: Plugins are called in sequence and in order of `plugins: []` in nuxt.config (or file names) +- If a composable depends on Vue.js lifecycle, it won't work + - Normally, Vue.js composables are bound to current component instance while plugins are only bound to `nuxtApp` + ## Automatically Providing Helpers If you would like to provide a helper on the `NuxtApp` instance, return it from the plugin under a `provide` key. For example: From c025c12c62d33d8434e5406e60b930ccef1156c1 Mon Sep 17 00:00:00 2001 From: HomWang <516310460@qq.com> Date: Mon, 22 Aug 2022 21:46:18 +0800 Subject: [PATCH 5/7] Bugs caused by spaces --- docs/content/2.guide/3.directory-structure/11.plugins.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md index f80b63729f7..bd2ec2ccd38 100644 --- a/docs/content/2.guide/3.directory-structure/11.plugins.md +++ b/docs/content/2.guide/3.directory-structure/11.plugins.md @@ -49,7 +49,7 @@ export default defineNuxtPlugin((NuxtApp) => { }) ``` -However, keep in mind there are some limitations and differences: +However, keep in mind there are some limitations and differences: - If a composable depends on another plugin that it registered later, it won't work. - Reason: Plugins are called in sequence and in order of `plugins: []` in nuxt.config (or file names) From 920de1c1e32f442a5a8ebca9800caf68637af10a Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 22 Aug 2022 16:06:14 +0200 Subject: [PATCH 6/7] update exception --- .../2.guide/3.directory-structure/11.plugins.md | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md index bd2ec2ccd38..bbc2ace8405 100644 --- a/docs/content/2.guide/3.directory-structure/11.plugins.md +++ b/docs/content/2.guide/3.directory-structure/11.plugins.md @@ -41,7 +41,7 @@ export default defineNuxtPlugin(nuxtApp => { ## Using Composables Within Plugins -You can use auto-imports [composables](https://v3.nuxtjs.org/guide/directory-structure/composables#example) within Nuxt plugins: +You can use [composables](/guide/directory-structure/composables) within Nuxt plugins: ```ts export default defineNuxtPlugin((NuxtApp) => { @@ -51,10 +51,13 @@ export default defineNuxtPlugin((NuxtApp) => { However, keep in mind there are some limitations and differences: -- If a composable depends on another plugin that it registered later, it won't work. - - Reason: Plugins are called in sequence and in order of `plugins: []` in nuxt.config (or file names) -- If a composable depends on Vue.js lifecycle, it won't work - - Normally, Vue.js composables are bound to current component instance while plugins are only bound to `nuxtApp` +**If a composable depends on another plugin registered later, it might not work.** + +**Reason:** Plugins are called sequencially and before everything else. Depending on order, you might use a composable that the plugin it is depending on, is not called yet. + +**If a composable depends on the Vue.js lifecycle, it won't work.** + +**Reason:** Normally, Vue.js composables are bound to the current component instance while plugins are only bound to `nuxtApp` instance. ## Automatically Providing Helpers From ee5db3ea00378c9acd7cbd9f47c0d170b657dba3 Mon Sep 17 00:00:00 2001 From: Pooya Parsa Date: Mon, 22 Aug 2022 16:08:52 +0200 Subject: [PATCH 7/7] update senstence --- docs/content/2.guide/3.directory-structure/11.plugins.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/content/2.guide/3.directory-structure/11.plugins.md b/docs/content/2.guide/3.directory-structure/11.plugins.md index bbc2ace8405..2b93add1edb 100644 --- a/docs/content/2.guide/3.directory-structure/11.plugins.md +++ b/docs/content/2.guide/3.directory-structure/11.plugins.md @@ -53,7 +53,7 @@ However, keep in mind there are some limitations and differences: **If a composable depends on another plugin registered later, it might not work.** -**Reason:** Plugins are called sequencially and before everything else. Depending on order, you might use a composable that the plugin it is depending on, is not called yet. +**Reason:** Plugins are called in order sequencially and before everything else. You might use a composable that dependants on another plugin which is not called yet. **If a composable depends on the Vue.js lifecycle, it won't work.**