general-basic-form 1.0.26 → 1.0.28

package/dist/index.js

@@ -0,0 +1,394 @@
+import { resolveComponent as u, openBlock as a, createBlock as s, withCtx as c, createTextVNode as g, toDisplayString as D, resolveDirective as N, withDirectives as S, mergeProps as p, createElementBlock as k, Fragment as P, renderList as y, withKeys as V, createSlots as q, resolveDynamicComponent as x, createCommentVNode as f, createElementVNode as R, createVNode as z, renderSlot as O, vShow as E } from "vue";
+const v = (e, n) => {
+  const r = e.__vccOpts || e;
+  for (const [d, o] of n)
+    r[d] = o;
+  return r;
+}, K = {
+  props: {
+    verificationSetting: {
+      type: Object,
+      default: () => {
+      }
+    },
+    getSmscode: {
+      type: Function,
+      default: () => {
+      }
+    }
+  },
+  data() {
+    return {
+      defaultText: this.verificationSetting.defaultText || "获取验证码",
+      buttonText: this.verificationSetting.defaultText || "获取验证码",
+      restTime: this.verificationSetting.restTime || 60,
+      timer: null
+    };
+  },
+  computed: {
+    buttonType() {
+      return this.buttonText === this.defaultText;
+    }
+  },
+  destroyed() {
+    this.reset();
+  },
+  methods: {
+    reset() {
+      this.timer && (clearInterval(this.timer), this.timer = null, this.buttonText = this.defaultText);
+    },
+    async buttonClick() {
+      if (this.buttonText === this.defaultText)
+        if (this.buttonText = this.restTime, this.timer = setInterval(() => {
+          if (Number(this.buttonText) <= 0 || !this.buttonText) {
+            this.reset();
+            return;
+          } else
+            this.buttonText = Number(this.buttonText) - 1;
+        }, 1e3), this.getSmscode)
+          await this.getSmscode() === !1 && this.reset();
+        else
+          return;
+    }
+  }
+};
+function Q(e, n, r, d, o, i) {
+  const h = u("el-button");
+  return a(), s(h, { onClick: i.buttonClick }, {
+    default: c(() => [
+      g(D(i.buttonType ? o.defaultText : o.buttonText + "s"), 1)
+    ]),
+    _: 1
+  }, 8, ["onClick"]);
+}
+const G = /* @__PURE__ */ v(K, [["render", Q]]), j = {
+  name: "GeneralBasicForm",
+  components: {
+    InputArchive: (e) => {
+      const { templateEle: n } = e;
+      return n();
+    },
+    VerificationButton: G
+  },
+  props: {
+    showSearch: {
+      // 是否展示所有元素
+      type: Boolean,
+      default: !0
+    },
+    loading: {
+      // 加载动画
+      type: Boolean,
+      default: !1
+    },
+    formOnly: {
+      // 是否只展示表单不展示按钮
+      type: Boolean,
+      default: !1
+    },
+    getList: {
+      // 查找数据调用的函数
+      type: Function,
+      default: () => {
+      }
+    },
+    afterReset: {
+      // 在重置按钮点击完后但还没重新请求时触发的的函数
+      type: Function,
+      default: () => {
+      }
+    },
+    formItem: {
+      // 定义表单的数据
+      type: Array,
+      default: []
+    },
+    size: {
+      // 控制按钮大小
+      type: String,
+      default: "default"
+    },
+    labelWidth: {
+      // 表单文字宽度
+      type: String,
+      default: "90px"
+    },
+    noUrlParameters: {
+      // 不接受和不改变url的参数
+      type: Boolean,
+      default: () => !1
+    },
+    formData: {
+      // 外部传入的表单数据，用于回填
+      type: Object,
+      default: () => {
+      }
+    },
+    noInputBlank: {
+      // 用于判断input框是否校验仅空格
+      type: Boolean,
+      default: () => !1
+    }
+  },
+  data() {
+    var e;
+    return {
+      queryParams: {
+        ...this.noUrlParameters ? {} : (e = this.$route) == null ? void 0 : e.query
+      },
+      // form表单数据
+      formLoading: this.loading || !1,
+      selectSetting: {
+        placeholder: "请选择",
+        filterable: !0,
+        clearable: !0,
+        style: "width: 200px"
+      },
+      inputSetting: {
+        placeholder: "请输入",
+        style: "width: 200px",
+        clearable: !0
+      },
+      datePackerSetting: {
+        style: "width: 227px",
+        "start-placeholder": "开始日期",
+        "end-placeholder": "结束日期",
+        type: "daterange"
+      }
+    };
+  },
+  // setup(props) {
+  //设置默认值
+  //   console.log(props);
+  //   // const { formItem } = toRefs(props);
+  //   const { formItem } = props;
+  //   console.log(formItem);
+  //   const queryParams = {};
+  //   formItem.forEach((item) => {
+  //     queryParams[item.prop] = "";
+  //   });
+  //   return {
+  //     queryParams,
+  //   };
+  // },
+  watch: {
+    formData: {
+      handler(e, n) {
+        JSON.stringify(e) !== JSON.stringify(n) && (this.queryParams = {
+          ...this.noUrlParameters ? {} : this.queryParams,
+          ...e
+        });
+      },
+      // watch 默认是懒执行的：仅当数据源变化时，才会执行回调。但在某些场景中，我们希望在创建侦听器时，立即执行一遍回调。举例来说，我们想请求一些初始数据，然后在相关状态更改时重新请求数据。
+      // https://cn.vuejs.org/guide/essentials/watchers.html#deep-watchers
+      immediate: !0
+      // deep: true,
+    },
+    queryParams: {
+      handler(e) {
+        this.$emit("update:formData", e);
+      },
+      deep: !0
+    },
+    loading(e) {
+      this.formLoading !== e && (this.formLoading = e);
+    },
+    formLoading(e) {
+      this.loading !== e && this.$emit("update:loading", e);
+    }
+  },
+  methods: {
+    /** 搜索按钮操作 */
+    handleQuery() {
+      var r;
+      const e = { page: 1, limit: 10 }, n = {
+        ...(r = this.$route) == null ? void 0 : r.query,
+        ...this.queryParams,
+        ...e
+      };
+      this.noUrlParameters || this.$router.push({
+        query: { ...n }
+      }), this.getList({
+        ...n
+      });
+    },
+    /** 重置按钮操作 */
+    async resetQuery() {
+      var n;
+      this.$refs.queryFormRef.resetFields();
+      const e = { page: 1 };
+      this.noUrlParameters || await this.$router.push({
+        query: { ...e }
+      }), this.queryParams = {
+        ...this.noUrlParameters ? {} : (n = this.$route) == null ? void 0 : n.query
+      }, this.afterReset(), this.handleQuery();
+    },
+    currentInputComponent() {
+      return "input-archive";
+    },
+    getItemRules(e) {
+      const { type: n, rules: r = [] } = e, d = [...r];
+      return this.noInputBlank && n === "input" && d.push({
+        pattern: this.trimRegex,
+        message: "请输入（不能仅输入空格）",
+        trigger: "blur"
+      }), d;
+    },
+    getInputSetting(e) {
+      const { inputSetting: n } = e;
+      return {
+        ...this.inputSetting,
+        ...n
+      };
+    },
+    getSelectSetting(e) {
+      const { selectSetting: n } = e;
+      return {
+        ...this.selectSetting,
+        ...n
+      };
+    },
+    getDatePackerSetting(e) {
+      const { datePackerSetting: n } = e;
+      return {
+        ...this.datePackerSetting,
+        ...n
+      };
+    }
+  }
+}, A = { slot: "append" };
+function J(e, n, r, d, o, i) {
+  const h = u("el-input"), T = u("verification-button"), w = u("el-option"), U = u("el-select"), I = u("el-cascader"), C = u("el-date-picker"), B = u("el-input-number"), _ = u("el-form-item"), b = u("el-button"), F = u("el-form"), L = N("loading");
+  return S((a(), s(F, p({
+    model: o.queryParams,
+    ref: "queryFormRef",
+    inline: "",
+    "label-position": "left",
+    "label-width": r.labelWidth
+  }, e.$attrs), {
+    default: c(() => [
+      (a(!0), k(P, null, y(r.formItem, (t) => (a(), s(_, {
+        label: t.label,
+        prop: t.prop,
+        key: t.prop,
+        rules: i.getItemRules(t)
+      }, {
+        default: c(() => [
+          t.type === "input" ? (a(), s(h, p({
+            key: 0,
+            onKeydown: V(r.getList, ["enter"]),
+            modelValue: o.queryParams[t.prop],
+            "onUpdate:modelValue": (l) => o.queryParams[t.prop] = l,
+            size: r.size
+          }, i.getInputSetting(t)), q({ _: 2 }, [
+            y(t.template, (l, m) => ({
+              name: m,
+              fn: c(() => [
+                l ? (a(), s(x(i.currentInputComponent()), {
+                  key: m,
+                  templateEle: l
+                }, null, 8, ["templateEle"])) : f("", !0)
+              ])
+            }))
+          ]), 1040, ["onKeydown", "modelValue", "onUpdate:modelValue", "size"])) : t.type === "input-mobile-verification" ? (a(), s(h, p({
+            key: 1,
+            onKeydown: V(r.getList, ["enter"]),
+            modelValue: o.queryParams[t.prop],
+            "onUpdate:modelValue": (l) => o.queryParams[t.prop] = l,
+            size: r.size
+          }, i.getInputSetting(t)), q({
+            default: c(() => [
+              R("template", A, [
+                z(T, {
+                  verificationSetting: t.verificationSetting,
+                  getSmscode: t.getSmscode
+                }, null, 8, ["verificationSetting", "getSmscode"])
+              ])
+            ]),
+            _: 2
+          }, [
+            y(t.template, (l, m) => ({
+              name: m,
+              fn: c(() => [
+                l ? (a(), s(x(i.currentInputComponent()), {
+                  key: m,
+                  templateEle: l
+                }, null, 8, ["templateEle"])) : f("", !0)
+              ])
+            }))
+          ]), 1040, ["onKeydown", "modelValue", "onUpdate:modelValue", "size"])) : t.type === "select" ? (a(), s(U, p({
+            key: 2,
+            filterable: "",
+            modelValue: o.queryParams[t.prop],
+            "onUpdate:modelValue": (l) => o.queryParams[t.prop] = l,
+            size: r.size
+          }, i.getSelectSetting(t)), {
+            default: c(() => [
+              (a(!0), k(P, null, y(t.option || [], (l) => (a(), s(w, {
+                key: l.value,
+                label: l.desc,
+                value: l.value
+              }, null, 8, ["label", "value"]))), 128))
+            ]),
+            _: 2
+          }, 1040, ["modelValue", "onUpdate:modelValue", "size"])) : t.type === "cascader" ? (a(), s(I, p({
+            key: 3,
+            filterable: "",
+            modelValue: o.queryParams[t.prop],
+            "onUpdate:modelValue": (l) => o.queryParams[t.prop] = l,
+            size: r.size,
+            options: t.options || []
+          }, i.getSelectSetting(t)), null, 16, ["modelValue", "onUpdate:modelValue", "size", "options"])) : t.type === "date-picker" ? (a(), s(C, p({
+            key: 4,
+            modelValue: o.queryParams[t.prop],
+            "onUpdate:modelValue": (l) => o.queryParams[t.prop] = l,
+            size: r.size
+          }, i.getDatePackerSetting(t)), null, 16, ["modelValue", "onUpdate:modelValue", "size"])) : f("", !0),
+          t.type === "input-number" ? (a(), s(B, p({
+            key: 5,
+            modelValue: o.queryParams[t.prop],
+            "onUpdate:modelValue": (l) => o.queryParams[t.prop] = l,
+            size: r.size
+          }, i.getInputSetting(t)), null, 16, ["modelValue", "onUpdate:modelValue", "size"])) : f("", !0)
+        ]),
+        _: 2
+      }, 1032, ["label", "prop", "rules"]))), 128)),
+      O(e.$slots, "default"),
+      r.formOnly ? f("", !0) : (a(), s(_, { key: 0 }, {
+        default: c(() => [
+          S((a(), s(b, {
+            type: "primary",
+            icon: "el-icon-search",
+            size: r.size,
+            onClick: i.handleQuery
+          }, {
+            default: c(() => [
+              g("查询")
+            ]),
+            _: 1
+          }, 8, ["size", "onClick"])), [
+            [L, o.formLoading]
+          ]),
+          z(b, {
+            icon: "el-icon-refresh",
+            size: r.size,
+            onClick: i.resetQuery
+          }, {
+            default: c(() => [
+              g("重置")
+            ]),
+            _: 1
+          }, 8, ["size", "onClick"])
+        ]),
+        _: 1
+      }))
+    ]),
+    _: 3
+  }, 16, ["model", "label-width"])), [
+    [E, r.showSearch]
+  ]);
+}
+const W = /* @__PURE__ */ v(j, [["render", J]]), M = W;
+export {
+  M as VGeneralBasicForm
+};

package/dist/index.umd.cjs

@@ -0,0 +1 @@
+(function(s,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis<"u"?globalThis:s||self,e(s.Index={},s.Vue))})(this,function(s,e){"use strict";const m=(t,r)=>{const n=t.__vccOpts||t;for(const[c,a]of r)n[c]=a;return n},h={props:{verificationSetting:{type:Object,default:()=>{}},getSmscode:{type:Function,default:()=>{}}},data(){return{defaultText:this.verificationSetting.defaultText||"获取验证码",buttonText:this.verificationSetting.defaultText||"获取验证码",restTime:this.verificationSetting.restTime||60,timer:null}},computed:{buttonType(){return this.buttonText===this.defaultText}},destroyed(){this.reset()},methods:{reset(){this.timer&&(clearInterval(this.timer),this.timer=null,this.buttonText=this.defaultText)},async buttonClick(){if(this.buttonText===this.defaultText)if(this.buttonText=this.restTime,this.timer=setInterval(()=>{if(Number(this.buttonText)<=0||!this.buttonText){this.reset();return}else this.buttonText=Number(this.buttonText)-1},1e3),this.getSmscode)await this.getSmscode()===!1&&this.reset();else return}}};function y(t,r,n,c,a,i){const d=e.resolveComponent("el-button");return e.openBlock(),e.createBlock(d,{onClick:i.buttonClick},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(i.buttonType?a.defaultText:a.buttonText+"s"),1)]),_:1},8,["onClick"])}const g={name:"GeneralBasicForm",components:{InputArchive:t=>{const{templateEle:r}=t;return r()},VerificationButton:m(h,[["render",y]])},props:{showSearch:{type:Boolean,default:!0},loading:{type:Boolean,default:!1},formOnly:{type:Boolean,default:!1},getList:{type:Function,default:()=>{}},afterReset:{type:Function,default:()=>{}},formItem:{type:Array,default:[]},size:{type:String,default:"default"},labelWidth:{type:String,default:"90px"},noUrlParameters:{type:Boolean,default:()=>!1},formData:{type:Object,default:()=>{}},noInputBlank:{type:Boolean,default:()=>!1}},data(){var t;return{queryParams:{...this.noUrlParameters?{}:(t=this.$route)==null?void 0:t.query},formLoading:this.loading||!1,selectSetting:{placeholder:"请选择",filterable:!0,clearable:!0,style:"width: 200px"},inputSetting:{placeholder:"请输入",style:"width: 200px",clearable:!0},datePackerSetting:{style:"width: 227px","start-placeholder":"开始日期","end-placeholder":"结束日期",type:"daterange"}}},watch:{formData:{handler(t,r){JSON.stringify(t)!==JSON.stringify(r)&&(this.queryParams={...this.noUrlParameters?{}:this.queryParams,...t})},immediate:!0},queryParams:{handler(t){this.$emit("update:formData",t)},deep:!0},loading(t){this.formLoading!==t&&(this.formLoading=t)},formLoading(t){this.loading!==t&&this.$emit("update:loading",t)}},methods:{handleQuery(){var n;const t={page:1,limit:10},r={...(n=this.$route)==null?void 0:n.query,...this.queryParams,...t};this.noUrlParameters||this.$router.push({query:{...r}}),this.getList({...r})},async resetQuery(){var r;this.$refs.queryFormRef.resetFields();const t={page:1};this.noUrlParameters||await this.$router.push({query:{...t}}),this.queryParams={...this.noUrlParameters?{}:(r=this.$route)==null?void 0:r.query},this.afterReset(),this.handleQuery()},currentInputComponent(){return"input-archive"},getItemRules(t){const{type:r,rules:n=[]}=t,c=[...n];return this.noInputBlank&&r==="input"&&c.push({pattern:this.trimRegex,message:"请输入（不能仅输入空格）",trigger:"blur"}),c},getInputSetting(t){const{inputSetting:r}=t;return{...this.inputSetting,...r}},getSelectSetting(t){const{selectSetting:r}=t;return{...this.selectSetting,...r}},getDatePackerSetting(t){const{datePackerSetting:r}=t;return{...this.datePackerSetting,...r}}}},_={slot:"append"};function k(t,r,n,c,a,i){const d=e.resolveComponent("el-input"),b=e.resolveComponent("verification-button"),B=e.resolveComponent("el-option"),V=e.resolveComponent("el-select"),x=e.resolveComponent("el-cascader"),C=e.resolveComponent("el-date-picker"),P=e.resolveComponent("el-input-number"),u=e.resolveComponent("el-form-item"),f=e.resolveComponent("el-button"),w=e.resolveComponent("el-form"),T=e.resolveDirective("loading");return e.withDirectives((e.openBlock(),e.createBlock(w,e.mergeProps({model:a.queryParams,ref:"queryFormRef",inline:"","label-position":"left","label-width":n.labelWidth},t.$attrs),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.formItem,o=>(e.openBlock(),e.createBlock(u,{label:o.label,prop:o.prop,key:o.prop,rules:i.getItemRules(o)},{default:e.withCtx(()=>[o.type==="input"?(e.openBlock(),e.createBlock(d,e.mergeProps({key:0,onKeydown:e.withKeys(n.getList,["enter"]),modelValue:a.queryParams[o.prop],"onUpdate:modelValue":l=>a.queryParams[o.prop]=l,size:n.size},i.getInputSetting(o)),e.createSlots({_:2},[e.renderList(o.template,(l,p)=>({name:p,fn:e.withCtx(()=>[l?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(i.currentInputComponent()),{key:p,templateEle:l},null,8,["templateEle"])):e.createCommentVNode("",!0)])}))]),1040,["onKeydown","modelValue","onUpdate:modelValue","size"])):o.type==="input-mobile-verification"?(e.openBlock(),e.createBlock(d,e.mergeProps({key:1,onKeydown:e.withKeys(n.getList,["enter"]),modelValue:a.queryParams[o.prop],"onUpdate:modelValue":l=>a.queryParams[o.prop]=l,size:n.size},i.getInputSetting(o)),e.createSlots({default:e.withCtx(()=>[e.createElementVNode("template",_,[e.createVNode(b,{verificationSetting:o.verificationSetting,getSmscode:o.getSmscode},null,8,["verificationSetting","getSmscode"])])]),_:2},[e.renderList(o.template,(l,p)=>({name:p,fn:e.withCtx(()=>[l?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(i.currentInputComponent()),{key:p,templateEle:l},null,8,["templateEle"])):e.createCommentVNode("",!0)])}))]),1040,["onKeydown","modelValue","onUpdate:modelValue","size"])):o.type==="select"?(e.openBlock(),e.createBlock(V,e.mergeProps({key:2,filterable:"",modelValue:a.queryParams[o.prop],"onUpdate:modelValue":l=>a.queryParams[o.prop]=l,size:n.size},i.getSelectSetting(o)),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.option||[],l=>(e.openBlock(),e.createBlock(B,{key:l.value,label:l.desc,value:l.value},null,8,["label","value"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue","size"])):o.type==="cascader"?(e.openBlock(),e.createBlock(x,e.mergeProps({key:3,filterable:"",modelValue:a.queryParams[o.prop],"onUpdate:modelValue":l=>a.queryParams[o.prop]=l,size:n.size,options:o.options||[]},i.getSelectSetting(o)),null,16,["modelValue","onUpdate:modelValue","size","options"])):o.type==="date-picker"?(e.openBlock(),e.createBlock(C,e.mergeProps({key:4,modelValue:a.queryParams[o.prop],"onUpdate:modelValue":l=>a.queryParams[o.prop]=l,size:n.size},i.getDatePackerSetting(o)),null,16,["modelValue","onUpdate:modelValue","size"])):e.createCommentVNode("",!0),o.type==="input-number"?(e.openBlock(),e.createBlock(P,e.mergeProps({key:5,modelValue:a.queryParams[o.prop],"onUpdate:modelValue":l=>a.queryParams[o.prop]=l,size:n.size},i.getInputSetting(o)),null,16,["modelValue","onUpdate:modelValue","size"])):e.createCommentVNode("",!0)]),_:2},1032,["label","prop","rules"]))),128)),e.renderSlot(t.$slots,"default"),n.formOnly?e.createCommentVNode("",!0):(e.openBlock(),e.createBlock(u,{key:0},{default:e.withCtx(()=>[e.withDirectives((e.openBlock(),e.createBlock(f,{type:"primary",icon:"el-icon-search",size:n.size,onClick:i.handleQuery},{default:e.withCtx(()=>[e.createTextVNode("查询")]),_:1},8,["size","onClick"])),[[T,a.formLoading]]),e.createVNode(f,{icon:"el-icon-refresh",size:n.size,onClick:i.resetQuery},{default:e.withCtx(()=>[e.createTextVNode("重置")]),_:1},8,["size","onClick"])]),_:1}))]),_:3},16,["model","label-width"])),[[e.vShow,n.showSearch]])}const S=m(g,[["render",k]]);s.VGeneralBasicForm=S,Object.defineProperty(s,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,12 +1,20 @@
 {
   "name": "general-basic-form",
-  "version": "1.0.26",
+  "version": "1.0.28",
   "description": "",
-  "main": "./src/index.js",
+  "main": "./dist/index.umd.cjs",
+  "type": "module",
   "scripts": {
-    "serve": "webpack-dev-server --config config/webpack.dev.js",
-    "build": "webpack --config config/webpack.prod.js",
-    "test": "echo \"Error: no test specified\" && exit 1"
+    "build": "cross-env CURRENT_ENV=prod run-p type-check && run-p build-only",
+    "test:e2e": "playwright test",
+    "build-only": "vite build",
+    "type-check": "tsc --noEmit -p tsconfig.json --composite false",
+    "link": "tsx script/link.ts && yarn link",
+    "unlink": "tsx script/unlinkModule.ts && yarn unlink && run-p build",
+    "linkNode": "tsx script/linkNode.ts && yarn link && run-p dev",
+    "unlinkNode": "tsx script/unlinkNode.ts && yarn unlink && run-p buildts",
+    "dev": "tsc -w -p .",
+    "buildts": "rimraf dist && tsc -p ."
   },
   "keywords": [
     "general-basic-form",
@@ -15,18 +23,40 @@
     "vue2",
     "vue3",
     "element-plus",
-    "element-plus"
+    "typescript"
   ],
   "author": "chendeli419287484@qq.com",
   "license": "ISC",
   "repository": {
     "type": "git",
-    "url": "https://github.com/Alan1034/GeneralBasicForm"
+    "url": "git+https://github.com/Alan1034/GeneralBasicForm.git"
   },
   "devDependencies": {
-    "babel-eslint": "^10.1.0",
-    "eslint": "^7.32.0",
-    "eslint-plugin-vue": "^7.14.0"
+    "@playwright/test": "^1.36.1",
+    "@types/node": "^20.8.10",
+    "@vitejs/plugin-legacy": "^4.1.1",
+    "@vitejs/plugin-vue": "^4.2.3",
+    "@vitejs/plugin-vue-jsx": "^3.0.1",
+    "cross-env": "^7.0.3",
+    "less": "^4.2.0",
+    "chalk": "^2.4.2",
+    "npm-run-all": "^4.1.5",
+    "rimraf": "^5.0.5",
+    "tsx": "^4.0.0",
+    "typescript": "^5.2.2",
+    "vite-plugin-image-optimizer": "^1.1.6"
   },
-  "dependencies": {}
+  "typings": "./dist/index.d.ts",
+  "module": "./dist/index.js",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js",
+      "require": "./dist/index.umd.cjs",
+      "types": "./dist/index.d.ts"
+    },
+    "./style": "./dist/style.css"
+  },
+  "files": [
+    "/dist"
+  ]
 }

package/config/webpack.common.js

@@ -1,98 +0,0 @@
-const path = require("path");
-const webpack = require("webpack");
-const { VueLoaderPlugin } = require('vue-loader')
-
-module.exports = {
-    entry: "./src/index.js",
-    module: {
-        rules: [
-            {
-                test: /\.js$/,
-                exclude: file => (
-                    /node_modules/.test(file) &&
-                    !/\.vue\.js/.test(file)
-                ),
-                use: [
-                    // "thread-loader",// 多线程编译，可能会导致报错
-                    {
-                        loader: 'babel-loader',
-                        options: {
-                            presets: ['@babel/preset-env']
-                        }
-                    }
-                ],
-            },
-
-            {
-                test: /\.css$/,
-                use: ['vue-style-loader', 'css-loader']
-            },
-            {
-                test: /\.less$/,
-                use: ['vue-style-loader', 'css-loader', 'less-loader']
-            },
-            {
-                test: /\.scss$/,
-                use: [
-                    'vue-style-loader',
-                    'css-loader',
-                    'sass-loader'
-                ]
-            },
-            {
-                test: /\.(eot|svg|ttf|woff|woff2)$/,
-                use: {
-                    loader: 'file-loader',
-                    options: {
-                        outputPath: 'fonts/',
-                        esModule: false
-                    }
-                }
-            },
-            {
-                test: /\.(png|jpg|gif)$/,
-                use: {
-                    loader: 'file-loader',
-                    options: {
-                        outputPath: 'assets/',
-                        esModule: false
-                    }
-                }
-            },
-            {
-                test: /\.vue$/,
-                loader: 'vue-loader',
-                options: {
-                    use: [
-                        // "thread-loader",// 多线程编译，可能会导致报错
-                        {
-                            loader: 'babel-loader',
-                            options: {
-                                presets: ['@babel/preset-env']
-                            }
-                        }
-                    ],
-                }
-            },
-        ]
-    },
-    resolve: {
-        extensions: ['\*', '.js', '.jsx', '.vue'],// 能够使用户在引入模块时不带扩展
-        alias: {
-            "@": path.resolve(__dirname, '../src'),
-        },
-    },
-    output: {
-        path: path.resolve(__dirname, "../dist/"),
-        publicPath: "/",
-        filename: "bundle.js"
-    },
-    //why:https://github.com/vuejs/vue-next/tree/master/packages/vue#bundler-build-feature-flags
-    plugins: [
-        new webpack.HotModuleReplacementPlugin(),
-        new VueLoaderPlugin(),
-        new webpack.DefinePlugin({
-            "__VUE_OPTIONS_API__": true,
-            "__VUE_PROD_DEVTOOLS__": false,
-        })]
-};

package/config/webpack.dev.js

@@ -1,15 +0,0 @@
-const path = require("path");
-const { merge } = require('webpack-merge');
-const common = require('./webpack.common.js');
-
-module.exports = merge(common, {
-  mode: 'development',
-  devtool: 'inline-source-map',
-  devServer: {
-    contentBase: path.join(__dirname, "dist"),
-    port: 3000,
-    hot: true,
-    open: true, //自动打开浏览器
-    // host: '0.0.0.0',//开启项目本地服务
-  },
-});

package/config/webpack.prod.js

@@ -1,16 +0,0 @@
-const { merge } = require('webpack-merge');
-const common = require('./webpack.common.js');
-const UglifyJsPlugin = require('uglifyjs-webpack-plugin')
-const { CleanWebpackPlugin } = require('clean-webpack-plugin');
-
-module.exports = merge(common, {
-  mode: 'production',
-  plugins: [
-    new UglifyJsPlugin({
-      uglifyOptions: {
-        comments: "some", //去掉部分注释
-      }
-    }),
-    new CleanWebpackPlugin(),// 构筑前清理dist文件夹
-  ]
-});