nbb-component-ui 1.0.4 → 1.0.6

package/index.js

@@ -1,12 +1,10 @@
-import MyButton from './src/MyButton.vue'
 import {ProcessFlow} from "./src/ProcessFlow";
 
 // 支持全局注册
 const install = (app) => {
-  app.component('MyButton', MyButton)
   app.component('ProcessFlow', ProcessFlow)
 }
 // 支持按需引入
-export { MyButton, ProcessFlow }
+export {ProcessFlow }
 // 默认导出（全局注册用）
 export default { install }

package/package.json

@@ -1,15 +1,31 @@
 {
   "name": "nbb-component-ui",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "main": "index.js",
   "scripts": {
-	"build": "vite build"
+    "build": "vite build"
   },
-  "author": "",
+  "author": "胡鹏",
   "license": "ISC",
   "description": "",
   "devDependencies": {
-    "@vitejs/plugin-vue": "^6.0.5",
-    "vite": "^8.0.3"
+    "@vitejs/plugin-vue": "^4.0.0",
+    "element-plus": "^2.0.0",
+    "typescript": "^5.0.0",
+    "vite": "^4.0.0",
+    "vue": "^3.2.0",
+    "vue-tsc": "^1.0.0"
+  },
+  "peerDependencies": {
+    "element-plus": "^2.13.6",
+    "vue": "^3.0.0"
+  },
+  "peerDependenciesMeta": {
+    "vue": {
+      "optional": false
+    },
+    "element-plus": {
+      "optional": false
+    }
   }
 }

package/vite.config.js

@@ -1,20 +1,26 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
+import { resolve } from 'path'
 
 export default defineConfig({
   plugins: [vue()],
-
   build: {
     lib: {
-      entry: 'index.js',
-      name: 'MyComponent',
-      fileName: 'index'
+      entry: resolve(__dirname, 'index.js'),
+      name: 'NbbComponentUi',
+      fileName: (format) => `index.${format}.js`,
+      formats: ['es', 'umd']
     },
     rollupOptions: {
-      external: ['vue'],
+      // 【关键】外部化vue和element-plus，不打包进组件库
+      external: ['vue', 'element-plus'],
       output: {
-        globals: { vue: 'Vue' }
+        // UMD模式下的全局变量名
+        globals: {
+          vue: 'Vue',
+          'element-plus': 'ElementPlus'
+        }
       }
     }
   }
-})
+})

package/dist/index.css

@@ -1,2 +0,0 @@
-.my-btn[data-v-8e812d17]{color:#fff;cursor:pointer;border:none;border-radius:4px;padding:8px 16px}
-/*$vite$:1*/

package/dist/index.mjs

@@ -1,25 +0,0 @@
-import { createElementBlock as e, normalizeStyle as t, openBlock as n, renderSlot as r } from "vue";
-var i = /* @__PURE__ */ ((e, t) => {
-	let n = e.__vccOpts || e;
-	for (let [e, r] of t) n[e] = r;
-	return n;
-})({
-	__name: "MyButton",
-	props: { bgColor: {
-		type: String,
-		default: "#409eff"
-	} },
-	emits: ["click"],
-	setup(i, { emit: a }) {
-		let o = a, s = () => o("click");
-		return (a, o) => (n(), e("button", {
-			class: "my-btn",
-			style: t({ backgroundColor: i.bgColor }),
-			onClick: s
-		}, [r(a.$slots, "default", {}, void 0, !0)], 4));
-	}
-}, [["__scopeId", "data-v-8e812d17"]]), a = { install: (e) => {
-	e.component("MyButton", i);
-} };
-//#endregion
-export { i as MyButton, a as default };

package/dist/index.umd.js

@@ -1 +0,0 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`vue`)):typeof define==`function`&&define.amd?define([`exports`,`vue`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.MyComponent={},e.Vue))})(this,function(e,t){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});var n=((e,t)=>{let n=e.__vccOpts||e;for(let[e,r]of t)n[e]=r;return n})({__name:`MyButton`,props:{bgColor:{type:String,default:`#409eff`}},emits:[`click`],setup(e,{emit:n}){let r=n,i=()=>r(`click`);return(n,r)=>((0,t.openBlock)(),(0,t.createElementBlock)(`button`,{class:`my-btn`,style:(0,t.normalizeStyle)({backgroundColor:e.bgColor}),onClick:i},[(0,t.renderSlot)(n.$slots,`default`,{},void 0,!0)],4))}},[[`__scopeId`,`data-v-8e812d17`]]);e.MyButton=n,e.default={install:e=>{e.component(`MyButton`,n)}}});

package/src/MyButton.vue

@@ -1,32 +0,0 @@
-<template>
-  <button class="my-btn" :style="{ backgroundColor: bgColor }" @click="handleClick">
-    <slot></slot>
-  </button>
-</template>
-
-<script setup>
-import { defineProps, defineEmits } from 'vue'
-// 定义props
-const props = defineProps({
-  bgColor: {
-    type: String,
-    default: '#409eff'
-  }
-})
-// 定义事件
-const emit = defineEmits(['click'])
-const handleClick = () => {
-	console.log('我被点击了')
-	emit('click')
-}
-</script>
-
-<style scoped>
-.my-btn {
-  padding: 8px 16px;
-  border: none;
-  border-radius: 4px;
-  color: white;
-  cursor: pointer;
-}
-</style>