@chase-shao/vue-component-lib 1.0.0

package/LICENSE

@@ -0,0 +1,7 @@
+Copyright (c) 2017 [these people](https://github.com/rollup/rollup-starter-lib/graphs/contributors)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/README.md

@@ -0,0 +1,96 @@
+# Vue Component Library
+
+[![Build Status](https://img.shields.io/badge/build-passing-brightgreen.svg)](https://github.com/your-username/vue-component-lib)
+
+一个现代化的 Vue 3 组件库，使用 Vite 构建，支持 TypeScript 和 `<script setup>` 语法。
+
+## 特性
+
+- 🚀 **Vite 驱动** - 极快的构建速度和开发体验
+- ⚡ **Vue 3** - 完全支持 Composition API 和 `<script setup>`
+- 📦 **TypeScript** - 完整的类型支持
+- 🎨 **CSS 模块化** - 组件样式独立打包
+- 📚 **多格式输出** - ES、CJS、UMD 多种格式支持
+
+## 安装
+
+```bash
+npm install vue-component-lib
+# 或
+pnpm add vue-component-lib
+# 或
+yarn add vue-component-lib
+```
+
+## 使用
+
+### 作为 Vue 插件使用
+
+```typescript
+import { createApp } from 'vue'
+import MyPlugin from 'vue-component-lib'
+import 'vue-component-lib/dist/index.css'
+
+const app = createApp({})
+app.use(MyPlugin)
+```
+
+### 单独导入组件
+
+```typescript
+import { MyComponent } from 'vue-component-lib'
+import 'vue-component-lib/dist/index.css'
+```
+
+## 开发
+
+```bash
+# 克隆项目
+git clone https://github.com/your-username/vue-component-lib
+cd vue-component-lib
+
+# 安装依赖
+pnpm install
+
+# 开发模式（监听文件变化）
+pnpm dev
+
+# 构建
+pnpm build
+
+# 预览构建结果
+pnpm preview
+```
+
+## 构建输出
+
+- `dist/index.es.js` - ES 模块版本
+- `dist/index.cjs.js` - CommonJS 版本
+- `dist/index.umd.js` - UMD 版本（浏览器直接使用）
+- `dist/index.d.ts` - TypeScript 类型声明
+- `dist/index.css` - 组件样式
+
+## 技术栈
+
+- **构建工具**: Vite
+- **框架**: Vue 3
+- **语言**: TypeScript
+- **样式**: CSS with Scoped Styles
+
+## 许可证
+
+MIT License
+
+`npm test` builds the library, then tests it.
+
+## Variations
+
+* [babel](https://github.com/rollup/rollup-starter-lib/tree/babel) — illustrates writing the source code in ES2015 and transpiling it for older environments with [Babel](https://babeljs.io/)
+* [buble](https://github.com/rollup/rollup-starter-lib/tree/buble) — similar, but using [Bublé](https://buble.surge.sh/) which is a faster alternative with less configuration
+* [TypeScript](https://github.com/rollup/rollup-starter-lib/tree/typescript) — uses [TypeScript](https://www.typescriptlang.org/) for type-safe code and transpiling
+
+
+
+## License
+
+[MIT](LICENSE).

package/dist/MyComponent.vue.d.ts

@@ -0,0 +1,22 @@
+interface Props {
+    title?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
+    title: string;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/MyPlugin.d.ts

@@ -0,0 +1,8 @@
+import { App } from 'vue';
+import { default as MyComponent } from './MyComponent.vue';
+import { default as SetupComponent } from './SetupComponent.vue';
+declare const MyPlugin: {
+    install(app: App): void;
+};
+export default MyPlugin;
+export { MyComponent, SetupComponent };

package/dist/SetupComponent.vue.d.ts

@@ -0,0 +1,18 @@
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
+    initialCount: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>, {
+    title: import('vue').Ref<string, string>;
+    count: import('vue').Ref<number, number>;
+    increment: () => void;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
+    initialCount: {
+        type: NumberConstructor;
+        default: number;
+    };
+}>> & Readonly<{}>, {
+    initialCount: number;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/index.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("vue"),i={class:"my-component"},a=e.defineComponent({__name:"MyComponent",props:{title:{default:"Hello, Vue 3 with TypeScript!"}},setup(t){const n=t,o=e.ref(n.title);return(r,l)=>(e.openBlock(),e.createElementBlock("div",i,[e.createElementVNode("h2",null,e.toDisplayString(o.value),1),e.renderSlot(r.$slots,"default",{},void 0,!0)]))}}),s=(t,n)=>{const o=t.__vccOpts||t;for(const[r,l]of n)o[r]=l;return o},c=s(a,[["__scopeId","data-v-7649ee09"]]),m=e.defineComponent({name:"SetupComponent",props:{initialCount:{type:Number,default:0}},setup(t){const n=e.ref("Setup API Component"),o=e.ref(t.initialCount);return{title:n,count:o,increment:()=>{o.value++}}}}),d={class:"setup-component"};function f(t,n,o,r,l,C){return e.openBlock(),e.createElementBlock("div",d,[e.createElementVNode("h3",null,e.toDisplayString(t.title),1),e.createElementVNode("p",null,"Count: "+e.toDisplayString(t.count),1),e.createElementVNode("button",{onClick:n[0]||(n[0]=(...u)=>t.increment&&t.increment(...u))},"Increment"),e.renderSlot(t.$slots,"default",{},void 0,!0)])}const p=s(m,[["render",f],["__scopeId","data-v-5f4f20f5"]]),_={install(t){t.component("MyComponent",c),t.component("SetupComponent",p)}};exports.MyComponent=c;exports.SetupComponent=p;exports.default=_;
+//# sourceMappingURL=index.cjs.js.map

package/dist/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["../src/MyComponent.vue","../src/SetupComponent.vue","../src/MyPlugin.ts"],"sourcesContent":["<template>\n  <div class=\"my-component\">\n    <h2>{{ str }}</h2>\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref } from 'vue'\n\n// 支持 defineProps, defineEmits 等编译器宏\ninterface Props {\n  title?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Hello, Vue 3 with TypeScript!'\n})\n\nconst str = ref(props.title)\n</script>\n\n<style scoped>\n.my-component {\n  border: 2px solid #42b983;\n  padding: 16px;\n  border-radius: 8px;\n  font-family: sans-serif;\n}\n</style>","<template>\n  <div class=\"setup-component\">\n    <h3>{{ title }}</h3>\n    <p>Count: {{ count }}</p>\n    <button @click=\"increment\">Increment</button>\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\n\nexport default defineComponent({\n  name: 'SetupComponent',\n  props: {\n    initialCount: {\n      type: Number,\n      default: 0\n    }\n  },\n  setup(props) {\n    // 这是 <script setup> 的等价写法\n    const title = ref('Setup API Component')\n    const count = ref(props.initialCount)\n    \n    const increment = () => {\n      count.value++\n    }\n    \n    // 返回模板需要的所有响应式数据和方法\n    return {\n      title,\n      count,\n      increment\n    }\n  }\n})\n</script>\n\n<style scoped>\n.setup-component {\n  border: 2px solid #42b983;\n  padding: 16px;\n  border-radius: 8px;\n  font-family: sans-serif;\n  margin: 10px 0;\n}\n\nbutton {\n  background-color: #42b983;\n  color: white;\n  border: none;\n  padding: 8px 16px;\n  border-radius: 4px;\n  cursor: pointer;\n  margin-top: 8px;\n}\n\nbutton:hover {\n  background-color: #369870;\n}\n</style>\n","import type { App } from 'vue'\nimport MyComponent from './MyComponent.vue'\nimport SetupComponent from './SetupComponent.vue'\n\nconst MyPlugin = {\n  install(app: App) {\n    app.component('MyComponent', MyComponent)\n    app.component('SetupComponent', SetupComponent)\n  }\n}\n\nexport default MyPlugin\nexport { MyComponent, SetupComponent }"],"names":["props","__props","str","ref","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_renderSlot","_ctx","_sfc_main","defineComponent","title","count","_toDisplayString","_cache","args","MyPlugin","app","MyComponent","SetupComponent"],"mappings":"uQAeA,MAAMA,EAAQC,EAIRC,EAAMC,EAAAA,IAAIH,EAAM,KAAK,gBAlBzBI,YAAA,EAAAC,qBAGM,MAHNC,EAGM,CAFJC,EAAAA,mBAAkB,4BAAXL,EAAA,KAAG,EAAA,CAAA,EACVM,EAAAA,WAAQC,EAAA,OAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,qHCSZC,EAAeC,kBAAgB,CAC7B,KAAM,iBACN,MAAO,CACL,aAAc,CACZ,KAAM,OACN,QAAS,CAAA,CACX,EAEF,MAAMX,EAAO,CAEX,MAAMY,EAAQT,EAAAA,IAAI,qBAAqB,EACjCU,EAAQV,EAAAA,IAAIH,EAAM,YAAY,EAOpC,MAAO,CACL,MAAAY,EACA,MAAAC,EACA,UARgB,IAAM,CACtBA,EAAM,OACR,CAME,CAEJ,CACF,CAAC,EAnCMP,EAAA,CAAA,MAAM,iBAAA,0BAAX,OAAAF,YAAA,EAAAC,qBAKM,MALNC,EAKM,CAJJC,EAAAA,mBAAoB,4BAAbE,EAAA,KAAK,EAAA,CAAA,EACZF,qBAAyB,IAAA,KAAtB,UAAOO,EAAAA,gBAAGL,EAAA,KAAK,EAAA,CAAA,EAClBF,EAAAA,mBAA6C,SAAA,CAApC,QAAKQ,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAA,IAAAC,IAAEP,EAAA,WAAAA,EAAA,UAAA,GAAAO,CAAA,EAAA,EAAW,WAAS,EACpCR,EAAAA,WAAQC,EAAA,OAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,CAAA,8DCDNQ,EAAW,CACf,QAAQC,EAAU,CAChBA,EAAI,UAAU,cAAeC,CAAW,EACxCD,EAAI,UAAU,iBAAkBE,CAAc,CAChD,CACF"}

package/dist/index.css

@@ -0,0 +1 @@
+.my-component[data-v-7649ee09]{border:2px solid #42b983;padding:16px;border-radius:8px;font-family:sans-serif}.setup-component[data-v-5f4f20f5]{border:2px solid #42b983;padding:16px;border-radius:8px;font-family:sans-serif;margin:10px 0}button[data-v-5f4f20f5]{background-color:#42b983;color:#fff;border:none;padding:8px 16px;border-radius:4px;cursor:pointer;margin-top:8px}button[data-v-5f4f20f5]:hover{background-color:#369870}

package/dist/index.d.ts

@@ -0,0 +1,6 @@
+export * from './MyPlugin'
+export {}
+import MyComponentLibrary from './MyPlugin'
+export default MyComponentLibrary
+export * from './MyPlugin'
+export {}

package/dist/index.es.js

@@ -0,0 +1,58 @@
+import { defineComponent as l, ref as r, createElementBlock as u, openBlock as i, createElementVNode as s, renderSlot as a, toDisplayString as c } from "vue";
+const f = { class: "my-component" }, _ = /* @__PURE__ */ l({
+  __name: "MyComponent",
+  props: {
+    title: { default: "Hello, Vue 3 with TypeScript!" }
+  },
+  setup(t) {
+    const e = r(t.title);
+    return (o, p) => (i(), u("div", f, [
+      s("h2", null, c(e.value), 1),
+      a(o.$slots, "default", {}, void 0, !0)
+    ]));
+  }
+}), m = (t, n) => {
+  const e = t.__vccOpts || t;
+  for (const [o, p] of n)
+    e[o] = p;
+  return e;
+}, C = /* @__PURE__ */ m(_, [["__scopeId", "data-v-7649ee09"]]), v = l({
+  name: "SetupComponent",
+  props: {
+    initialCount: {
+      type: Number,
+      default: 0
+    }
+  },
+  setup(t) {
+    const n = r("Setup API Component"), e = r(t.initialCount);
+    return {
+      title: n,
+      count: e,
+      increment: () => {
+        e.value++;
+      }
+    };
+  }
+}), y = { class: "setup-component" };
+function $(t, n, e, o, p, h) {
+  return i(), u("div", y, [
+    s("h3", null, c(t.title), 1),
+    s("p", null, "Count: " + c(t.count), 1),
+    s("button", {
+      onClick: n[0] || (n[0] = (...d) => t.increment && t.increment(...d))
+    }, "Increment"),
+    a(t.$slots, "default", {}, void 0, !0)
+  ]);
+}
+const S = /* @__PURE__ */ m(v, [["render", $], ["__scopeId", "data-v-5f4f20f5"]]), I = {
+  install(t) {
+    t.component("MyComponent", C), t.component("SetupComponent", S);
+  }
+};
+export {
+  C as MyComponent,
+  S as SetupComponent,
+  I as default
+};
+//# sourceMappingURL=index.es.js.map

package/dist/index.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.js","sources":["../src/MyComponent.vue","../src/SetupComponent.vue","../src/MyPlugin.ts"],"sourcesContent":["<template>\n  <div class=\"my-component\">\n    <h2>{{ str }}</h2>\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref } from 'vue'\n\n// 支持 defineProps, defineEmits 等编译器宏\ninterface Props {\n  title?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Hello, Vue 3 with TypeScript!'\n})\n\nconst str = ref(props.title)\n</script>\n\n<style scoped>\n.my-component {\n  border: 2px solid #42b983;\n  padding: 16px;\n  border-radius: 8px;\n  font-family: sans-serif;\n}\n</style>","<template>\n  <div class=\"setup-component\">\n    <h3>{{ title }}</h3>\n    <p>Count: {{ count }}</p>\n    <button @click=\"increment\">Increment</button>\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\n\nexport default defineComponent({\n  name: 'SetupComponent',\n  props: {\n    initialCount: {\n      type: Number,\n      default: 0\n    }\n  },\n  setup(props) {\n    // 这是 <script setup> 的等价写法\n    const title = ref('Setup API Component')\n    const count = ref(props.initialCount)\n    \n    const increment = () => {\n      count.value++\n    }\n    \n    // 返回模板需要的所有响应式数据和方法\n    return {\n      title,\n      count,\n      increment\n    }\n  }\n})\n</script>\n\n<style scoped>\n.setup-component {\n  border: 2px solid #42b983;\n  padding: 16px;\n  border-radius: 8px;\n  font-family: sans-serif;\n  margin: 10px 0;\n}\n\nbutton {\n  background-color: #42b983;\n  color: white;\n  border: none;\n  padding: 8px 16px;\n  border-radius: 4px;\n  cursor: pointer;\n  margin-top: 8px;\n}\n\nbutton:hover {\n  background-color: #369870;\n}\n</style>\n","import type { App } from 'vue'\nimport MyComponent from './MyComponent.vue'\nimport SetupComponent from './SetupComponent.vue'\n\nconst MyPlugin = {\n  install(app: App) {\n    app.component('MyComponent', MyComponent)\n    app.component('SetupComponent', SetupComponent)\n  }\n}\n\nexport default MyPlugin\nexport { MyComponent, SetupComponent }"],"names":["str","ref","__props","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_renderSlot","_ctx","_sfc_main","defineComponent","props","title","count","_toDisplayString","_cache","args","MyPlugin","app","MyComponent","SetupComponent"],"mappings":";;;;;;;AAmBA,UAAMA,IAAMC,EAJEC,EAIQ,KAAK;sBAlBzBC,EAAA,GAAAC,EAGM,OAHNC,GAGM;AAAA,MAFJC,EAAkB,cAAXN,EAAA,KAAG,GAAA,CAAA;AAAA,MACVO,EAAQC,EAAA,QAAA,WAAA,CAAA,GAAA,QAAA,EAAA;AAAA,IAAA;;;;;;;iECSZC,IAAeC,EAAgB;AAAA,EAC7B,MAAM;AAAA,EACN,OAAO;AAAA,IACL,cAAc;AAAA,MACZ,MAAM;AAAA,MACN,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF,MAAMC,GAAO;AAEX,UAAMC,IAAQX,EAAI,qBAAqB,GACjCY,IAAQZ,EAAIU,EAAM,YAAY;AAOpC,WAAO;AAAA,MACL,OAAAC;AAAA,MACA,OAAAC;AAAA,MACA,WARgB,MAAM;AACtB,QAAAA,EAAM;AAAA,MACR;AAAA,IAME;AAAA,EAEJ;AACF,CAAC,GAnCMR,IAAA,EAAA,OAAM,kBAAA;;AAAX,SAAAF,EAAA,GAAAC,EAKM,OALNC,GAKM;AAAA,IAJJC,EAAoB,cAAbE,EAAA,KAAK,GAAA,CAAA;AAAA,IACZF,EAAyB,KAAA,MAAtB,YAAOQ,EAAGN,EAAA,KAAK,GAAA,CAAA;AAAA,IAClBF,EAA6C,UAAA;AAAA,MAApC,SAAKS,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,IAAAC,MAAER,EAAA,aAAAA,EAAA,UAAA,GAAAQ,CAAA;AAAA,IAAA,GAAW,WAAS;AAAA,IACpCT,EAAQC,EAAA,QAAA,WAAA,CAAA,GAAA,QAAA,EAAA;AAAA,EAAA,CAAA;;mFCDNS,IAAW;AAAA,EACf,QAAQC,GAAU;AAChB,IAAAA,EAAI,UAAU,eAAeC,CAAW,GACxCD,EAAI,UAAU,kBAAkBE,CAAc;AAAA,EAChD;AACF;"}

package/dist/index.umd.js

@@ -0,0 +1,2 @@
+(function(n,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis<"u"?globalThis:n||self,e(n.MyComponentLibrary={},n.Vue))})(this,function(n,e){"use strict";const d={class:"my-component"},m=e.defineComponent({__name:"MyComponent",props:{title:{default:"Hello, Vue 3 with TypeScript!"}},setup(t){const o=t,i=e.ref(o.title);return(r,s)=>(e.openBlock(),e.createElementBlock("div",d,[e.createElementVNode("h2",null,e.toDisplayString(i.value),1),e.renderSlot(r.$slots,"default",{},void 0,!0)]))}}),l=(t,o)=>{const i=t.__vccOpts||t;for(const[r,s]of o)i[r]=s;return i},p=l(m,[["__scopeId","data-v-7649ee09"]]),u=e.defineComponent({name:"SetupComponent",props:{initialCount:{type:Number,default:0}},setup(t){const o=e.ref("Setup API Component"),i=e.ref(t.initialCount);return{title:o,count:i,increment:()=>{i.value++}}}}),a={class:"setup-component"};function f(t,o,i,r,s,C){return e.openBlock(),e.createElementBlock("div",a,[e.createElementVNode("h3",null,e.toDisplayString(t.title),1),e.createElementVNode("p",null,"Count: "+e.toDisplayString(t.count),1),e.createElementVNode("button",{onClick:o[0]||(o[0]=(...y)=>t.increment&&t.increment(...y))},"Increment"),e.renderSlot(t.$slots,"default",{},void 0,!0)])}const c=l(u,[["render",f],["__scopeId","data-v-5f4f20f5"]]),_={install(t){t.component("MyComponent",p),t.component("SetupComponent",c)}};n.MyComponent=p,n.SetupComponent=c,n.default=_,Object.defineProperties(n,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+//# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.umd.js","sources":["../src/MyComponent.vue","../src/SetupComponent.vue","../src/MyPlugin.ts"],"sourcesContent":["<template>\n  <div class=\"my-component\">\n    <h2>{{ str }}</h2>\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { ref } from 'vue'\n\n// 支持 defineProps, defineEmits 等编译器宏\ninterface Props {\n  title?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Hello, Vue 3 with TypeScript!'\n})\n\nconst str = ref(props.title)\n</script>\n\n<style scoped>\n.my-component {\n  border: 2px solid #42b983;\n  padding: 16px;\n  border-radius: 8px;\n  font-family: sans-serif;\n}\n</style>","<template>\n  <div class=\"setup-component\">\n    <h3>{{ title }}</h3>\n    <p>Count: {{ count }}</p>\n    <button @click=\"increment\">Increment</button>\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\n\nexport default defineComponent({\n  name: 'SetupComponent',\n  props: {\n    initialCount: {\n      type: Number,\n      default: 0\n    }\n  },\n  setup(props) {\n    // 这是 <script setup> 的等价写法\n    const title = ref('Setup API Component')\n    const count = ref(props.initialCount)\n    \n    const increment = () => {\n      count.value++\n    }\n    \n    // 返回模板需要的所有响应式数据和方法\n    return {\n      title,\n      count,\n      increment\n    }\n  }\n})\n</script>\n\n<style scoped>\n.setup-component {\n  border: 2px solid #42b983;\n  padding: 16px;\n  border-radius: 8px;\n  font-family: sans-serif;\n  margin: 10px 0;\n}\n\nbutton {\n  background-color: #42b983;\n  color: white;\n  border: none;\n  padding: 8px 16px;\n  border-radius: 4px;\n  cursor: pointer;\n  margin-top: 8px;\n}\n\nbutton:hover {\n  background-color: #369870;\n}\n</style>\n","import type { App } from 'vue'\nimport MyComponent from './MyComponent.vue'\nimport SetupComponent from './SetupComponent.vue'\n\nconst MyPlugin = {\n  install(app: App) {\n    app.component('MyComponent', MyComponent)\n    app.component('SetupComponent', SetupComponent)\n  }\n}\n\nexport default MyPlugin\nexport { MyComponent, SetupComponent }"],"names":["props","__props","str","ref","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_renderSlot","_ctx","_sfc_main","defineComponent","title","count","_toDisplayString","_cache","args","MyPlugin","app","MyComponent","SetupComponent"],"mappings":"iZAeA,MAAMA,EAAQC,EAIRC,EAAMC,EAAAA,IAAIH,EAAM,KAAK,gBAlBzBI,YAAA,EAAAC,qBAGM,MAHNC,EAGM,CAFJC,EAAAA,mBAAkB,4BAAXL,EAAA,KAAG,EAAA,CAAA,EACVM,EAAAA,WAAQC,EAAA,OAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,qHCSZC,EAAeC,kBAAgB,CAC7B,KAAM,iBACN,MAAO,CACL,aAAc,CACZ,KAAM,OACN,QAAS,CAAA,CACX,EAEF,MAAMX,EAAO,CAEX,MAAMY,EAAQT,EAAAA,IAAI,qBAAqB,EACjCU,EAAQV,EAAAA,IAAIH,EAAM,YAAY,EAOpC,MAAO,CACL,MAAAY,EACA,MAAAC,EACA,UARgB,IAAM,CACtBA,EAAM,OACR,CAME,CAEJ,CACF,CAAC,EAnCMP,EAAA,CAAA,MAAM,iBAAA,0BAAX,OAAAF,YAAA,EAAAC,qBAKM,MALNC,EAKM,CAJJC,EAAAA,mBAAoB,4BAAbE,EAAA,KAAK,EAAA,CAAA,EACZF,qBAAyB,IAAA,KAAtB,UAAOO,EAAAA,gBAAGL,EAAA,KAAK,EAAA,CAAA,EAClBF,EAAAA,mBAA6C,SAAA,CAApC,QAAKQ,EAAA,CAAA,IAAAA,EAAA,CAAA,EAAA,IAAAC,IAAEP,EAAA,WAAAA,EAAA,UAAA,GAAAO,CAAA,EAAA,EAAW,WAAS,EACpCR,EAAAA,WAAQC,EAAA,OAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,CAAA,8DCDNQ,EAAW,CACf,QAAQC,EAAU,CAChBA,EAAI,UAAU,cAAeC,CAAW,EACxCD,EAAI,UAAU,iBAAkBE,CAAc,CAChD,CACF"}

package/package.json

@@ -0,0 +1,61 @@
+{
+  "name": "@chase-shao/vue-component-lib",
+  "version": "1.0.0",
+  "type": "module",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.es.js",
+  "browser": "dist/index.umd.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.es.js",
+      "require": "./dist/index.cjs.js"
+    },
+    "./dist/style.css": "./dist/index.css"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^6.0.1",
+    "@vue/compiler-sfc": "^3.5.18",
+    "tslib": "^2.8.1",
+    "typescript": "^5.9.2",
+    "vite": "^7.0.6",
+    "vite-plugin-dts": "^4.5.4",
+    "vue": "^3.5.18"
+  },
+  "scripts": {
+    "build": "vite build",
+    "dev": "vite build --watch",
+    "preview": "vite preview",
+    "test": "node test/test.js",
+    "pretest": "npm run build"
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "vue",
+    "vue3",
+    "component",
+    "library",
+    "typescript",
+    "vite"
+  ],
+  "author": "chase-shao",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/your-username/vue-component-lib.git"
+  },
+  "bugs": {
+    "url": "https://github.com/your-username/vue-component-lib/issues"
+  },
+  "homepage": "https://github.com/your-username/vue-component-lib#readme",
+  "peerDependencies": {
+    "vue": "^3.5.18"
+  }
+}