{"id":13560590,"url":"https://github.com/vue-vine/vue-vine","last_synced_at":"2025-05-14T00:08:31.284Z","repository":{"id":169687791,"uuid":"645691031","full_name":"vue-vine/vue-vine","owner":"vue-vine","description":"Another style of writing Vue components.","archived":false,"fork":false,"pushed_at":"2025-05-08T02:01:06.000Z","size":5557,"stargazers_count":1326,"open_issues_count":0,"forks_count":63,"subscribers_count":11,"default_branch":"main","last_synced_at":"2025-05-08T03:18:46.750Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"https://vue-vine.dev","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/vue-vine.png","metadata":{"files":{"readme":"README-CN.md","changelog":null,"contributing":"CONTRIBUTING-zhCN.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":["ShenQingchuan"]}},"created_at":"2023-05-26T08:09:54.000Z","updated_at":"2025-05-08T02:01:09.000Z","dependencies_parsed_at":"2024-01-14T02:51:44.310Z","dependency_job_id":"1e68ce66-0bc9-4c32-9ca8-3df314d75756","html_url":"https://github.com/vue-vine/vue-vine","commit_stats":{"total_commits":450,"total_committers":24,"mean_commits":18.75,"dds":0.1711111111111111,"last_synced_commit":"d148224852c495f4e589ce8ac979f620bd9c87ea"},"previous_names":["vue-vine/vue-vine"],"tags_count":76,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-vine%2Fvue-vine","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-vine%2Fvue-vine/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-vine%2Fvue-vine/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/vue-vine%2Fvue-vine/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/vue-vine","download_url":"https://codeload.github.com/vue-vine/vue-vine/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253405028,"owners_count":21903114,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-08-01T13:00:47.089Z","updated_at":"2025-05-14T00:08:26.261Z","avatar_url":"https://github.com/vue-vine.png","language":"TypeScript","funding_links":["https://github.com/sponsors/ShenQingchuan"],"categories":["TypeScript","others","Plugins"],"sub_categories":["Rsbuild Plugins"],"readme":"# Vue Vine\n\n- [English README](./README.md)\n- [贡献指南](./CONTRIBUTING-zhCN.md)\n\n创造另一种书写 Vue 组件的方式。\n\n- NPM 版本：\u0026nbsp; [![NPM Version](https://img.shields.io/npm/v/vue-vine)](https://www.npmjs.com/package/vue-vine)\n- VSCode 插件版本：\u0026nbsp; [![VSCode ext version](https://img.shields.io/visual-studio-marketplace/v/shenqingchuan.vue-vine-extension)](https://marketplace.visualstudio.com/items?itemName=shenqingchuan.vue-vine-extension)\n- Open VSX 插件版本: \u0026nbsp; [![Open VSX ext version](https://img.shields.io/open-vsx/v/shenqingchuan/vue-vine-extension)](https://open-vsx.org/extension/shenqingchuan/vue-vine-extension)\n- 要了解更多细节，请查看 [官方文档](https://vue-vine.dev)：\u0026nbsp;[![Netlify Status](https://api.netlify.com/api/v1/badges/ff99c4c5-2766-4716-81db-599ce4346647/deploy-status)](https://app.netlify.com/sites/vue-vine/deploys)\n\n\u003cdetails\u003e\n  \u003csummary\u003e\n    \u003cb\u003e为什么做这样一个项目？\u003c/b\u003e\n  \u003c/summary\u003e\n  \u003cbr\u003e\n\n  在社区中，有很多帖子讨论过希望有一个支持在单个文件中编写多个 Vue 组件的解决方案。`Vue Vine` 因此而生。\n\n  `Vue Vine` 旨在提供更多管理 Vue 组件的灵活性，它并不是要取代 Vue SFC，而是作为一种并行的解决方案。\n\n  下面是一个简单的示例预览：\n\n  ![示例预览](./packages/docs/src/public/highlight-demo.png)\n\n\u003c/details\u003e\n\n## 尝试示例\n\n使用交互式命令(`create-vue-vine`)创建您的第一个项目。看这里: [项目启动模板](https://vue-vine.dev/zh/introduction/ecosystem.html#project-starter-template)\n\n或者你可以在线上尝试: [Vue Vine Playground](https://stackblitz.com/~/github.com/vue-vine/stackblitz-playground)\n\n## 项目 NPM 包总览\n\n| 类别 | 包名 | 版本 | 简介 |\n| --- | --- | --- | --- |\n| ![core](https://img.shields.io/badge/vue_vine-core-blue) | [@vue-vine/compiler](./packages/compiler) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/compiler)](https://www.npmjs.com/package/@vue-vine/compiler) | 编译器 |\n| ![core](https://img.shields.io/badge/vue_vine-core-blue) | [@vue-vine/language-server](./packages/language-server) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/language-server)](https://www.npmjs.com/package/@vue-vine/language-server) | 语言服务器 |\n| ![core](https://img.shields.io/badge/vue_vine-core-blue) | [@vue-vine/language-service](./packages/language-service) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/language-service)](https://www.npmjs.com/package/@vue-vine/language-service) | 语言服务集成 |\n| ![core](https://img.shields.io/badge/vue_vine-core-blue) | [@vue-vine/vite-plugin](./packages/vite-plugin) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/vite-plugin)](https://www.npmjs.com/package/@vue-vine/vite-plugin) | Vite 插件 |\n| ![eslint](https://img.shields.io/badge/vue_vine-eslint-gold) | [@vue-vine/eslint-parser](./packages/eslint-parser) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/eslint-parser)](https://www.npmjs.com/package/@vue-vine/eslint-parser) | ESLint 自定义解析器 |\n| ![eslint](https://img.shields.io/badge/vue_vine-eslint-gold) | [@vue-vine/eslint-plugin](./packages/eslint-plugin) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/eslint-plugin)](https://www.npmjs.com/package/@vue-vine/eslint-plugin) | ESLint 插件 |\n| ![eslint](https://img.shields.io/badge/vue_vine-eslint-gold) | [@vue-vine/eslint-config](./packages/eslint-config) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/eslint-config)](https://www.npmjs.com/package/@vue-vine/eslint-config) | ESLint 配置 |\n| ![nuxt](https://img.shields.io/badge/vue_vine-nuxt-green) | [@vue-vine/nuxt](./packages/nuxt-module) | [![NPM Version](https://img.shields.io/npm/v/@vue-vine/nuxt)](https://www.npmjs.com/package/@vue-vine/nuxt) | Nuxt Module |\n| ![tsc](https://img.shields.io/badge/vue_vine-tsc-violet) | [vue-vine-tsc](./packages/tsc) | [![NPM Version](https://img.shields.io/npm/v/vue-vine-tsc)](https://www.npmjs.com/package/vue-vine-tsc) | TypeScript CLI 检查器 |\n| ![CLI](https://img.shields.io/badge/vue_vine-cli-cyan) | [create-vue-vine](./packages/create-vue-vine) | [![NPM Version](https://img.shields.io/npm/v/create-vue-vine)](https://www.npmjs.com/package/create-vue-vine) | 项目脚手架 CLI |\n\n## 安装\n\n```bash\n# 如果你还没有安装 `@antfu/ni`，我强烈建议你安装它。\nni -D vue-vine\n```\n\n在 `vite.config.ts` 中使用插件：\n\n```ts\nimport { VineVitePlugin } from 'vue-vine/vite'\n\nexport default defineConfig({\n  plugins: [\n    // ...其他插件\n    VineVitePlugin()\n  ],\n})\n```\n\n然后在 `tsconfig.json` 中添加宏的类型定义：\n\n```json\n{\n  \"compilerOptions\": {\n    \"types\": [\"vue-vine/macros\"]\n  }\n}\n```\n\n对于 ESLint, 请安装我们提供的 ESLint 配置包：\n\n```bash\nni -D @vue-vine/eslint-config\n```\n\n你需要将其载入到 ESLint flat configs 中。\n\n```js\nimport antfu from '@antfu/eslint-config'\n\n// `VueVine()` 返回了一个 ESLint flat config\nimport VueVine from '@vue-vine/eslint-config'\n\nexport default antfu(\n  {\n    // 第一个选项对象不是 ESLint 的 FlatConfig\n    // 是 antfu 规则自身的配置\n  },\n  ...VueVine(),\n)\n```\n\n最后，安装 VSCode 插件，在市场中搜索 `Vue Vine`。\n\n\u003cimg width=\"339\" alt=\"image\" src=\"https://github.com/vue-vine/vue-vine/assets/46062972/d86867d3-5a63-4541-b318-f5543f90cf0e\"\u003e\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvue-vine%2Fvue-vine","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fvue-vine%2Fvue-vine","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fvue-vine%2Fvue-vine/lists"}