Zengtudor/Nuxt
1
0
Fork 0
mirror of https://github.com/nuxt/nuxt.git synced 2024-11-11 08:33:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: complete features/modules section (#4284)

Browse Source 
Co-authored-by: Daniel Roe <daniel@roe.dev>
This commit is contained in:
Clément Ollivier 2022-04-12 11:09:10 +02:00 committed by GitHub
parent 81bf1c065e
commit 42a0ef56dd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 40 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
docs/content/2.guide/2.features/13.modules.md
View File

@ -1,10 +1,47 @@
# Modules
Nuxt modules make integrations super simple. You don't have to develop everything from scratch nor bear with maintaining an extra boilerplate when there is already a Nuxt module for it. Adding Nuxt modules is possible using [`nuxt.config`](/api/configuration/nuxt.config#modules).
Nuxt provides a module system to extend the framework core and simplify integrations. You don't need to develop everything from scratch nor maintain boilerplate if there is already a Nuxt module for it. Adding Nuxt modules is possible using [`nuxt.config`](/api/configuration/nuxt.config#modules).
You can find a list of [Nuxt 3 compatible modules here](https://modules.nuxtjs.org/?version=3.x).
## Exploring Nuxt Modules
When developing production-grade applications with Nuxt you might find that the framework's core functionality is not enough. Nuxt can be extended with configuration options and plugins, but maintaining these customizations across multiple projects can be tedious, repetitive and time-consuming. On the other hand, supporting every project's needs out of the box would make Nuxt very complex and hard to use.
This is one of the reasons why Nuxt provides a module system that makes it possible to extend the core. Nuxt modules are async functions that sequentially run when starting nuxt in development mode using `nuxi dev` or building a project for production with `nuxi build`. They can override templates, configure webpack loaders, add CSS libraries, and perform many other useful tasks.
Best of all, Nuxt modules can be distributed in npm packages. This makes it possible for them to be reused across projects and shared with the community, helping create an ecosystem of high-quality add-ons.
::ReadMore{link="https://modules.nuxtjs.org/?version=3.x" title="Nuxt 3 Compatible Modules"}
::
## The `modules` Property
Once you have installed the modules you can then add them to your `nuxt.config.ts` file under the `modules` property. Modules developers usually provide additional steps and details for usage.
```ts{}[nuxt.config.ts]
export default defineNuxtConfig({
modules: [
// Using package name (recommanded usage)
'@nuxtjs/example',
// Load a local module
'./modules/example',
// Add module with inline-options
['./modules/example', { token: '123' }]
// Inline module definition
async (inlineOptions, nuxt) => { }
]
})
```
::alert{type="warning" icon=⚠️}
Nuxt modules are now build-time-only, and the `buildModules` property used in Nuxt 2 is deprecated in favor of `modules`.
::
## Module development
Everyone has the opportunity to develop modules. Read more about developing modules in the [Module Author Guide](/guide/going-further/modules).
::NeedContribution
::ReadMore{link="/guide/going-further/modules" title="Module Author Guide"}
::