Nuxt UI 的蓬勃发展离不开其卓越的社区 ❤️。我们欢迎通过错误报告、拉取请求和反馈来为改进此库做出贡献。
以下是 Nuxt UI 项目结构中主要目录和文件的概述
文档位于 docs 文件夹中,作为一个 Nuxt 应用程序,使用 @nuxt/content 从 Markdown 文件生成页面。有关其工作原理的详细信息,请参阅Nuxt Content 文档以下是其结构的细分
├── app/
│ ├── assets/
│ ├── components/
│ │ └── content/
│ │ └── examples # Components used in documentation as examples
│ ├── composables/
│ └── ...
├── content/
│ ├── 1.getting-started
│ ├── 2.composables
│ └── 3.components # Components documentation
模块代码位于 src 文件夹中。以下是其结构的细分
├── plugins/
├── runtime/
│ ├── components/ # Where all the components are located
│ │ ├── Accordion.vue
│ │ ├── Alert.vue
│ │ └── ...
│ ├── composables/
│ ├── locale/
│ ├── plugins/
│ ├── types/
│ ├── utils/
│ └── vue/
│ ├── components/
│ └── plugins/
├── theme/ # This where the theme for each component is located
│ ├── accordion.ts # Theme for Accordion component
│ ├── alert.ts
│ └── ...
└── module.ts
为了简化开发,我们创建了一个 CLI,您可以使用它来生成组件和语言环境。您可以使用 nuxt-ui make 命令访问它。
首先,您需要将 CLI 链接到您的全局环境
npm link
您可以使用以下命令创建新组件
nuxt-ui make component <name> [options]
可用选项
--primitive 创建一个原始组件--prose 创建一个 prose 组件--content 创建一个 content 组件--template 仅生成特定模板(可用模板:playground、docs、test、theme、component)示例
# Create a basic component
nuxt-ui make component my-component
# Create a prose component
nuxt-ui make component heading --prose
# Create a content component
nuxt-ui make component block --content
# Generate only documentation template
nuxt-ui make component my-component --template=docs
您可以使用以下命令创建新的语言环境
nuxt-ui make locale --code <code> --name <name>
在开始之前,请检查是否有现有问题描述您正在处理的问题或功能请求。如果有,请在该问题上留言,让我们知道您正在处理它。
如果没有,请打开一个新问题来讨论问题或功能。
要开始本地开发,请按照以下步骤操作
nuxt/ui 仓库克隆到您的本地机器git clone -b v4 https://github.com/nuxt/ui.git
corepack enable
pnpm install
pnpm run dev:prepare
docs 文件夹中处理文档,请运行pnpm run docs
pnpm run dev
pnpm run dev:vue
我们建议使用 VSCode 和ESLint 扩展。您可以在保存代码时启用自动修复和格式化。具体操作如下
{
"editor.codeActionsOnSave": {
"source.fixAll": false,
"source.fixAll.eslint": true
}
}
您可以使用 lint 命令检查 linting 错误
pnpm run lint # check for linting errors
pnpm run lint:fix # fix linting errors
我们使用 TypeScript 进行类型检查。您可以使用 typecheck 命令检查类型错误
pnpm run typecheck
在提交 PR 之前,请确保您运行了 nuxt 和 vue 的测试
pnpm run test # for Nuxt
pnpm run test:vue # for Vue
u。我们使用Conventional Commits来编写提交消息,这允许根据提交自动生成变更日志。如果您还不熟悉它,请阅读指南。
fix 和 featdocs;对于维护任务,请使用 choreSquash and Merge。lint、typecheck 和 tests 正常工作。避免进行不相关的更改。我们会及时审查。如果分配给维护者,他们会仔细审查。忽略红色文本;它用于跟踪目的。
再次感谢您对这个项目的兴趣!您太棒了!❤️