前面我提到了一个开发中常见需求：能够复用之前项目中的配置、已存在的组件、工具方法等等。Nuxt3 提供的 layers 特性能使我们非常容易地创建和维护这样的项目基础结构。

本节将会包括如下内容：

• layers 的使用场景；
• layers 使用方法 ；
• layers 常见用例；
• 如何定制一个 layers。

# Layers 使用场景

以下情况下比较适合使用 layers：

• 共享可重用配置项；
• 使用 components 目录共享组件库；
• 使用 composables 和 utils 目录共享工具函数；
• 创建 Nuxt 主题；
• 创建模块预设；
• 共享标准初始化步骤。

# Layers 使用方法

我们可以在 nuxt.config.ts 中配置 extends 选项从而继承一个 layers 配置。

有三种配置 layers 方式：

• 相对地址：从本地继承；
• Npm 包名：从 npm 安装；
• Github URL：从 Github 下载。

就像下面这样配置，nuxt.config.ts：

dart
复制代码export default defineNuxtConfig({
  extends: [
    '../base',                     // 从本地继承
    '@my-themes/awesome',          // 从 npm 安装
    'github:my-themes/awesome#v1', // 从 github 下载
  ]
})

# 范例：使用 docus 建设文档网站

社区有个用于文档建设的项目叫 docus，提供了 50 多个组件和设计系统便于创建文档类页面。docus 完全基于 layers 方式创建，因此可以快速在已存在的 Nuxt 项目中引入。

首先安装 docus：

sql
复制代码yarn add @nuxt-themes/docus

接下来只需要在项目中添加 extends 选项，nuxt.config.ts：

css
复制代码defineNuxtConfig({
  extends: '@nuxt-themes/docus'
})

这就好了！下面在 content 目录创建一个页面试试，content/index.md：

yaml
复制代码---
title: "Get Started"
description: "Let's learn how to use my amazing module."
aside: true
bottom: true
toc: true
---

# Get Started
Let's learn how to use my amazing module.
go to [install