✨:特性文档按需测试

2022-04-29 22:32:31 +08:00 · 2022-04-29 22:32:31 +08:00 · 9803b09ee6
commit 9803b09ee6
parent 813c56f86a
87 changed files with 258 additions and 198 deletions
--- a/package.json
+++ b/package.json
@ -4,6 +4,7 @@
  "homepage": "http://www.layui-vue.com",
  "scripts": {
    "dev": "pnpm -C ./package/document dev",
+    "dev:demand": "pnpm -C ./package/document dev:demand",
    "build": "npm run build:icons && npm run build:layer && npm run build:component && npm run build:document",
    "build:document": "pnpm -C ./package/document build",
    "build:component": "pnpm -C ./package/component build",
--- a/package/component/src/component/avatar/index.ts
+++ b/package/component/src/component/avatar/index.ts
@ -1,4 +1,4 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
--- a/package/component/src/component/avatarList/index.ts
+++ b/package/component/src/component/avatarList/index.ts
@ -1,4 +1,4 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
--- a/package/component/src/component/backTop/index.ts
+++ b/package/component/src/component/backTop/index.ts
@ -1,5 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
-export default component;
+export default component;
--- a/package/component/src/component/badge/index.ts
+++ b/package/component/src/component/badge/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/body/index.ts
+++ b/package/component/src/component/body/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/breadcrumb/index.ts
+++ b/package/component/src/component/breadcrumb/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/breadcrumbItem/index.ts
+++ b/package/component/src/component/breadcrumbItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/button/index.ts
+++ b/package/component/src/component/button/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/buttonContainer/index.ts
+++ b/package/component/src/component/buttonContainer/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/buttonGroup/index.ts
+++ b/package/component/src/component/buttonGroup/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/card/index.ts
+++ b/package/component/src/component/card/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/carousel/index.ts
+++ b/package/component/src/component/carousel/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/carouselItem/index.ts
+++ b/package/component/src/component/carouselItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/checkbox/index.ts
+++ b/package/component/src/component/checkbox/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/checkboxGroup/index.ts
+++ b/package/component/src/component/checkboxGroup/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/col/index.ts
+++ b/package/component/src/component/col/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/collapse/index.ts
+++ b/package/component/src/component/collapse/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/collapseItem/index.ts
+++ b/package/component/src/component/collapseItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/colorPicker/EyeDropper.vue
+++ b/package/component/src/component/colorPicker/EyeDropper.vue
@ -1,22 +1,43 @@
 <template>
-  <svg t="1651169382813" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2529" width="27" height="27">
-  <path
-    d="M769.3 409.1c-4.3-16.2-14.7-29.7-29.2-38l-51.3-29.6-10 17.3c-3.7 6.4-10.4 10-17.3 10-3.4 0-6.8-0.9-10-2.7l68.6 39.6c5.2 3 9 7.9 10.5 13.7 1.6 5.8 0.8 11.9-2.3 17.2l-6.6 11.5c-6.2 10.8-20.1 14.5-30.9 8.3L441 312.2c-5.2-3-9-7.9-10.5-13.7-1.6-5.8-0.8-11.9 2.3-17.2l6.6-11.5c3-5.2 7.9-9 13.7-10.5 1.9-0.5 3.9-0.8 5.9-0.8 3.9 0 7.8 1 11.3 3l69.3 40c-9.6-5.5-12.8-17.8-7.3-27.3l10-17.3-52-30c-14.5-8.4-31.4-10.6-47.5-6.3-16.2 4.3-29.7 14.7-38 29.2l-6.6 11.5c-8.4 14.5-10.6 31.4-6.3 47.5 4.3 16.2 14.7 29.7 29.2 38l52 30 10-17.3c5.5-9.6 17.8-12.8 27.3-7.3 9.6 5.5 12.8 17.8 7.3 27.3l-10 17.3 77.2 44.6 10-17.3c5.5-9.6 17.8-12.8 27.3-7.3 9.6 5.5 12.8 17.8 7.3 27.3l-10 17.3 51.3 29.6c9.8 5.7 20.6 8.4 31.2 8.4 21.7 0 42.7-11.2 54.3-31.3l6.6-11.5c8.5-14.5 10.7-31.4 6.4-47.5z"
-    fill="#515151" p-id="2530"></path>
-  <path
-    d="M644.2 338.8l10-17.3-77.2-44.6-10 17.3c-5.5 9.6-17.8 12.8-27.3 7.3l111.8 64.6c-9.6-5.5-12.9-17.8-7.3-27.3zM539.6 301.5zM651.5 366.1z"
-    fill="#515151" p-id="2531"></path>
-  <path
-    d="M624.1 195.2c12.3-21.3 39.6-28.6 60.9-16.3 10.3 6 17.7 15.6 20.8 27.1s1.5 23.5-4.5 33.8l-47.2 81.7 34.6 20 47.2-81.7c11.3-19.6 14.3-42.4 8.5-64.2-5.8-21.8-19.8-40.1-39.4-51.4-40.4-23.3-92.2-9.4-115.5 31l-47.2 81.7 34.6 20 47.2-81.7z"
-    fill="#515151" p-id="2532"></path>
-  <path
-    d="M644.2 338.8c-5.5 9.6-2.2 21.8 7.3 27.3 3.1 1.8 6.6 2.7 10 2.7 6.9 0 13.6-3.6 17.3-10l10-17.3-34.6-20-10 17.3zM539.6 301.5c9.6 5.5 21.8 2.2 27.3-7.3l10-17.3-34.6-20-10 17.3c-5.5 9.6-2.2 21.8 7.3 27.3z"
-    fill="#515151" p-id="2533"></path>
-  <path
-    d="M395.4 769.6c-2.6 4.4-6.5 7.6-11 9-2.3 0.7-6.9 1.5-11.3-1-9.6-5.5-21.8-2.2-27.3 7.3l-23.1 40c-1.7 2.9-4.2 5-7.1 5.8-1.7 0.5-4.1 0.8-6.5-0.5-2.4-1.4-3.3-3.7-3.7-5.4-0.7-2.9-0.1-6.2 1.5-9l22.9-39.7c5.6-9.7 2.3-22.2-7.4-27.8-7.3-4.2-9.2-14.7-4.2-23.3l189.5-328.2-34.6-20L283.6 705c-12.4 21.4-10.1 47.2 3.7 64.8l-15 26c-6.7 11.6-8.8 25.1-5.9 37.9 3 13.4 11.1 24.4 22.7 31.1 7.3 4.2 15.4 6.4 23.7 6.4 4.9 0 9.8-0.7 14.6-2.2 12.6-3.9 23.2-12.4 29.9-24.1l15-26c7.8 1.1 15.9 0.4 23.8-2 14.2-4.4 26.2-14.1 33.8-27.3l189.5-328.2-34.6-20-189.4 328.2z"
-    fill="#515151" p-id="2534"></path>
-  <path
-    d="M622.2 416.8c-9.6-5.5-21.8-2.2-27.3 7.3l-10 17.3 34.6 20 10-17.3c5.6-9.6 2.3-21.8-7.3-27.3zM517.7 379.5c5.5-9.6 2.2-21.8-7.3-27.3-9.6-5.5-21.8-2.2-27.3 7.3l-10 17.3 34.6 20 10-17.3z"
-    fill="#515151" p-id="2535"></path>
+  <svg
+    t="1651169382813"
+    class="icon"
+    viewBox="0 0 1024 1024"
+    version="1.1"
+    xmlns="http://www.w3.org/2000/svg"
+    p-id="2529"
+    width="27"
+    height="27"
+  >
+    <path
+      d="M769.3 409.1c-4.3-16.2-14.7-29.7-29.2-38l-51.3-29.6-10 17.3c-3.7 6.4-10.4 10-17.3 10-3.4 0-6.8-0.9-10-2.7l68.6 39.6c5.2 3 9 7.9 10.5 13.7 1.6 5.8 0.8 11.9-2.3 17.2l-6.6 11.5c-6.2 10.8-20.1 14.5-30.9 8.3L441 312.2c-5.2-3-9-7.9-10.5-13.7-1.6-5.8-0.8-11.9 2.3-17.2l6.6-11.5c3-5.2 7.9-9 13.7-10.5 1.9-0.5 3.9-0.8 5.9-0.8 3.9 0 7.8 1 11.3 3l69.3 40c-9.6-5.5-12.8-17.8-7.3-27.3l10-17.3-52-30c-14.5-8.4-31.4-10.6-47.5-6.3-16.2 4.3-29.7 14.7-38 29.2l-6.6 11.5c-8.4 14.5-10.6 31.4-6.3 47.5 4.3 16.2 14.7 29.7 29.2 38l52 30 10-17.3c5.5-9.6 17.8-12.8 27.3-7.3 9.6 5.5 12.8 17.8 7.3 27.3l-10 17.3 77.2 44.6 10-17.3c5.5-9.6 17.8-12.8 27.3-7.3 9.6 5.5 12.8 17.8 7.3 27.3l-10 17.3 51.3 29.6c9.8 5.7 20.6 8.4 31.2 8.4 21.7 0 42.7-11.2 54.3-31.3l6.6-11.5c8.5-14.5 10.7-31.4 6.4-47.5z"
+      fill="#515151"
+      p-id="2530"
+    ></path>
+    <path
+      d="M644.2 338.8l10-17.3-77.2-44.6-10 17.3c-5.5 9.6-17.8 12.8-27.3 7.3l111.8 64.6c-9.6-5.5-12.9-17.8-7.3-27.3zM539.6 301.5zM651.5 366.1z"
+      fill="#515151"
+      p-id="2531"
+    ></path>
+    <path
+      d="M624.1 195.2c12.3-21.3 39.6-28.6 60.9-16.3 10.3 6 17.7 15.6 20.8 27.1s1.5 23.5-4.5 33.8l-47.2 81.7 34.6 20 47.2-81.7c11.3-19.6 14.3-42.4 8.5-64.2-5.8-21.8-19.8-40.1-39.4-51.4-40.4-23.3-92.2-9.4-115.5 31l-47.2 81.7 34.6 20 47.2-81.7z"
+      fill="#515151"
+      p-id="2532"
+    ></path>
+    <path
+      d="M644.2 338.8c-5.5 9.6-2.2 21.8 7.3 27.3 3.1 1.8 6.6 2.7 10 2.7 6.9 0 13.6-3.6 17.3-10l10-17.3-34.6-20-10 17.3zM539.6 301.5c9.6 5.5 21.8 2.2 27.3-7.3l10-17.3-34.6-20-10 17.3c-5.5 9.6-2.2 21.8 7.3 27.3z"
+      fill="#515151"
+      p-id="2533"
+    ></path>
+    <path
+      d="M395.4 769.6c-2.6 4.4-6.5 7.6-11 9-2.3 0.7-6.9 1.5-11.3-1-9.6-5.5-21.8-2.2-27.3 7.3l-23.1 40c-1.7 2.9-4.2 5-7.1 5.8-1.7 0.5-4.1 0.8-6.5-0.5-2.4-1.4-3.3-3.7-3.7-5.4-0.7-2.9-0.1-6.2 1.5-9l22.9-39.7c5.6-9.7 2.3-22.2-7.4-27.8-7.3-4.2-9.2-14.7-4.2-23.3l189.5-328.2-34.6-20L283.6 705c-12.4 21.4-10.1 47.2 3.7 64.8l-15 26c-6.7 11.6-8.8 25.1-5.9 37.9 3 13.4 11.1 24.4 22.7 31.1 7.3 4.2 15.4 6.4 23.7 6.4 4.9 0 9.8-0.7 14.6-2.2 12.6-3.9 23.2-12.4 29.9-24.1l15-26c7.8 1.1 15.9 0.4 23.8-2 14.2-4.4 26.2-14.1 33.8-27.3l189.5-328.2-34.6-20-189.4 328.2z"
+      fill="#515151"
+      p-id="2534"
+    ></path>
+    <path
+      d="M622.2 416.8c-9.6-5.5-21.8-2.2-27.3 7.3l-10 17.3 34.6 20 10-17.3c5.6-9.6 2.3-21.8-7.3-27.3zM517.7 379.5c5.5-9.6 2.2-21.8-7.3-27.3-9.6-5.5-21.8-2.2-27.3 7.3l-10 17.3 34.6 20 10-17.3z"
+      fill="#515151"
+      p-id="2535"
+    ></path>
  </svg>
-</template>
+</template>
--- a/package/component/src/component/colorPicker/index.ts
+++ b/package/component/src/component/colorPicker/index.ts
@ -1,4 +1,4 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
--- a/package/component/src/component/colorPicker/index.vue
+++ b/package/component/src/component/colorPicker/index.vue
@ -8,8 +8,8 @@ export default {
 import "./index.less";
 import LayDropdown from "../dropdown/index.vue";
 import EyeDropper from "./EyeDropper.vue";
-import { ref, computed, watch, onMounted, } from "vue";
-import { useEyeDropper } from '@vueuse/core'
+import { ref, computed, watch, onMounted } from "vue";
+import { useEyeDropper } from "@vueuse/core";

 const emit = defineEmits(["update:modelValue"]);

@ -27,7 +27,7 @@ const props = withDefaults(defineProps<LayColorPicker>(), {
 const saturationValue = ref<null | HTMLElement>(null);
 const hueSlider = ref<null | HTMLElement>(null);
 const alphaSlider = ref<null | HTMLElement>(null);
-const { isSupported, open, sRGBHex } = useEyeDropper()
+const { isSupported, open, sRGBHex } = useEyeDropper();

 let pointStyle = ref("top: 25%;left: 80%;");
 let hueSliderStyle = ref("left: 0;");
@ -42,13 +42,13 @@ let green = ref(0);
 let blue = ref(0);
 let alpha = ref(1);

-const openEyeDropper = function(){
-  if(isSupported){
+const openEyeDropper = function () {
+  if (isSupported) {
    open();
-  }else{
+  } else {
    console.warn("LayColorPicker: Eye dropper not supported by your browser!");
  }
-}
+};

 onMounted(() => {
  let { r, g, b, a } = parseColor(props.modelValue);
@ -64,7 +64,7 @@ watch(sRGBHex, (sRGBHex) => {
  green.value = g;
  blue.value = b;
  alpha.value = a;
-})
+});

 watch([red, green, blue], (newValue) => {
  emit(
@ -450,10 +450,11 @@ function hex2rgba(s: any) {
              ></div>
            </div>
          </div>
-          <div 
+          <div
            v-if="eyeDropper"
-            @click="openEyeDropper" 
-            style="margin-left: 5px;">
+            @click="openEyeDropper"
+            style="margin-left: 5px"
+          >
            <EyeDropper />
          </div>
          <div class="color-diamond">
--- a/package/component/src/component/container/index.ts
+++ b/package/component/src/component/container/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/countUp/index.ts
+++ b/package/component/src/component/countUp/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/datePicker/index.ts
+++ b/package/component/src/component/datePicker/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/dropdown/index.less
+++ b/package/component/src/component/dropdown/index.less
@ -27,7 +27,7 @@
 }


-.layui-menu {
+.layui-dropdown .layui-menu {
  position: relative;
  background-color: #fff;
 }
@ -37,7 +37,7 @@
  padding: 5px 15px;
 }

-.layui-menu li {
+.layui-dropdown .layui-menu li {
  position: relative;
  line-height: 26px;
  color: rgba(0, 0, 0, 0.8);
@ -46,11 +46,11 @@
  cursor: pointer;
 }

-.layui-menu li:hover {
+.layui-dropdown .layui-menu li:hover {
  background-color: var(--global-neutral-color-2);
 }

-.layui-menu-body-title {
+.layui-dropdown .layui-menu-body-title {
  position: relative;
  overflow: hidden;
  text-overflow: ellipsis;
--- a/package/component/src/component/dropdown/index.ts
+++ b/package/component/src/component/dropdown/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/dropdownMenu/index.ts
+++ b/package/component/src/component/dropdownMenu/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/dropdownMenuItem/index.ts
+++ b/package/component/src/component/dropdownMenuItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/empty/index.ts
+++ b/package/component/src/component/empty/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/exception/index.ts
+++ b/package/component/src/component/exception/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/field/index.ts
+++ b/package/component/src/component/field/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/footer/index.ts
+++ b/package/component/src/component/footer/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/form/index.ts
+++ b/package/component/src/component/form/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/formItem/index.ts
+++ b/package/component/src/component/formItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/fullscreen/index.ts
+++ b/package/component/src/component/fullscreen/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/header/index.ts
+++ b/package/component/src/component/header/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/icon/index.ts
+++ b/package/component/src/component/icon/index.ts
@ -1,6 +1,5 @@
-
 import { LayIcon as Component } from "@layui/icons-vue";
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";

 export const component = withInstall(Component);
 export default component;
--- a/package/component/src/component/iconPicker/index.ts
+++ b/package/component/src/component/iconPicker/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/input/index.ts
+++ b/package/component/src/component/input/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/inputNumber/index.ts
+++ b/package/component/src/component/inputNumber/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/layout/index.ts
+++ b/package/component/src/component/layout/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/line/index.ts
+++ b/package/component/src/component/line/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/logo/index.ts
+++ b/package/component/src/component/logo/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/menu/index.ts
+++ b/package/component/src/component/menu/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/menuItem/index.ts
+++ b/package/component/src/component/menuItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/noticeBar/index.ts
+++ b/package/component/src/component/noticeBar/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/page/index.ts
+++ b/package/component/src/component/page/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/panel/index.ts
+++ b/package/component/src/component/panel/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/progress/index.ts
+++ b/package/component/src/component/progress/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/quote/index.ts
+++ b/package/component/src/component/quote/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/radio/index.ts
+++ b/package/component/src/component/radio/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/rate/index.ts
+++ b/package/component/src/component/rate/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/result/index.ts
+++ b/package/component/src/component/result/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/ripple/index.ts
+++ b/package/component/src/component/ripple/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/row/index.ts
+++ b/package/component/src/component/row/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/scroll/index.ts
+++ b/package/component/src/component/scroll/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/select/index.ts
+++ b/package/component/src/component/select/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/selectOption/index.ts
+++ b/package/component/src/component/selectOption/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/side/index.ts
+++ b/package/component/src/component/side/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/skeleton/index.ts
+++ b/package/component/src/component/skeleton/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/skeletonItem/index.ts
+++ b/package/component/src/component/skeletonItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/slider/index.ts
+++ b/package/component/src/component/slider/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/splitPanel/index.ts
+++ b/package/component/src/component/splitPanel/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/splitPanelItem/index.ts
+++ b/package/component/src/component/splitPanelItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/step/index.ts
+++ b/package/component/src/component/step/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/stepItem/index.ts
+++ b/package/component/src/component/stepItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/subMenu/index.ts
+++ b/package/component/src/component/subMenu/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/switch/index.ts
+++ b/package/component/src/component/switch/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/tab/index.ts
+++ b/package/component/src/component/tab/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/tabItem/index.ts
+++ b/package/component/src/component/tabItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/table/index.ts
+++ b/package/component/src/component/table/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/textarea/index.ts
+++ b/package/component/src/component/textarea/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/timeline/index.ts
+++ b/package/component/src/component/timeline/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/timelineItem/index.ts
+++ b/package/component/src/component/timelineItem/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/tooltip/index.ts
+++ b/package/component/src/component/tooltip/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/transfer/index.ts
+++ b/package/component/src/component/transfer/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/transition/index.ts
+++ b/package/component/src/component/transition/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/tree/index.ts
+++ b/package/component/src/component/tree/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/component/upload/index.ts
+++ b/package/component/src/component/upload/index.ts
@ -1,6 +1,5 @@
-import { withInstall } from "../../utils"
+import { withInstall } from "../../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
 export default component;
-
--- a/package/component/src/provider/index.ts
+++ b/package/component/src/provider/index.ts
@ -1,4 +1,4 @@
-import { withInstall } from "../utils"
+import { withInstall } from "../utils";
 import Component from "./index.vue";

 export const component = withInstall(Component);
--- a/package/component/src/utils/index.ts
+++ b/package/component/src/utils/index.ts
@ -1,3 +1,3 @@
-export * from "./domUtil"
-export * from "./guidUtil"
-export * from "./install"
+export * from "./domUtil";
+export * from "./guidUtil";
+export * from "./install";
--- a/package/component/src/utils/install.ts
+++ b/package/component/src/utils/install.ts
@ -0,0 +1,17 @@
+import type { App } from "vue";
+import i18n from "../language";
+
+export const withInstall = (comp: any) => {
+  comp.install = (app: App | any) => {
+    if (
+      !app._instance?.isCE &&
+      !app._instance?.appContext?.app?.__VUE_I18N_SYMBOL__
+    ) {
+      app.use(i18n);
+    }
+
+    app.component(comp.name, comp);
+  };
+
+  return comp;
+};
--- a/package/document/.env.demand
+++ b/package/document/.env.demand
@ -0,0 +1 @@
+VITE_DEV_MODE=demand
--- a/package/document/package.json
+++ b/package/document/package.json
@ -7,6 +7,7 @@
  "homepage": "http://www.layui-vue.com",
  "scripts": {
    "dev": "vite",
+    "dev:demand": "vite --config ./vite.config.demand.ts",
    "build": "vite build"
  },
  "dependencies": {
@ -36,7 +37,10 @@
    "rollup": "^2.70.1",
    "typescript": "^4.6.3",
    "vite": "2.9.2",
-    "vite-plugin-md": "^0.12.4"
+    "vite-plugin-md": "^0.12.4",
+    "unplugin-auto-import": "^0.7.1",
+    "unplugin-vue-components": "^0.19.3",
+    "unplugin-layui-vue-resolver": "0.0.7"
  },
  "files": [
    "lib",
--- a/package/document/src/main.ts
+++ b/package/document/src/main.ts
@ -3,7 +3,7 @@ import { App, createApp as _createApp } from "vue";
 import { createRouter } from "./router/index";
 import { Router } from "vue-router";
 import Store from "./store";
-import layui from "../../component/src/index";
+// import layui from "../../component/src/index";
 import LayCode from "./components/LayCode.vue";
 import LaySearch from "./components/LaySearch.vue";
 import LayTableBox from "./components/LayTableBox.vue";
@ -17,14 +17,31 @@ export function createApp(): {
  const app = _createApp(Layout);
  const router = createRouter();

-  app
-    .use(layui)
-    .use(router)
-    .use(Store)
-    .component("LayCode", LayCode)
-    .component("LaySearch", LaySearch)
-    .component("LayTableBox", LayTableBox)
-    .component("LayAnchor", LayAnchor);
+  console.log("DEV_MODE", import.meta.env.VITE_DEV_MODE ?? import.meta.env.DEV);
+
+  if (import.meta.env.VITE_DEV_MODE != "demand") {
+    import("../../component/src/index").then((layui) => {
+      app
+        .use(layui)
+        .use(router)
+        .use(Store)
+        .component("LayCode", LayCode)
+        .component("LaySearch", LaySearch)
+        .component("LayTableBox", LayTableBox)
+        .component("LayAnchor", LayAnchor);
+    });
+  } else {
+    import("../../component/src/language").then((i18n) => {
+      app
+        .use(i18n.default)
+        .use(router)
+        .use(Store)
+        .component("LayCode", LayCode)
+        .component("LaySearch", LaySearch)
+        .component("LayTableBox", LayTableBox)
+        .component("LayAnchor", LayAnchor);
+    });
+  }

  return { app, router };
 }
--- a/package/document/vite.config.demand.ts
+++ b/package/document/vite.config.demand.ts
@ -0,0 +1,70 @@
+import path from "path";
+import { defineConfig } from "vite";
+import AutoImport from "unplugin-auto-import/vite";
+import Components from "unplugin-vue-components/vite";
+import { LayuiVueResolver } from "unplugin-layui-vue-resolver";
+import plugins from "./src/plugin/common-plugins";
+
+export default defineConfig({
+  resolve: {
+    alias: {
+      "/@src": path.resolve(__dirname, "./src"),
+    },
+  },
+  mode: "demand",
+  build: {
+    rollupOptions: {
+      output: {
+        manualChunks(id) {
+          if (id.includes("node_modules")) {
+            return id
+              .toString()
+              .split("node_modules/")[1]
+              .split("/")[0]
+              .toString();
+          }
+        },
+      },
+    },
+  },
+  plugins: [
+    AutoImport({
+      // 自动导入 vue 相关函数
+      imports: ["vue"],
+      // 自动导入 layer-vue 相关函数,例如 layer 等
+      resolvers: [
+        // @ts-ignore
+        LayuiVueResolver({
+          exclude: [/^Lay[A-Z]/],
+        }),
+      ],
+      dts: path.resolve(path.resolve(__dirname, "src"), "auto-imports.d.ts"),
+    }),
+    Components({
+      // 用于搜索组件的目录
+      dirs: ["src/document/zh-CN/components"],
+      // 允许在 'src/document/zh-CN/components' 下自动加载 markdown
+      extensions: ["vue", "md"],
+      // 允许自动导入和注册 markdown 中使用的组件
+      include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
+      // 自动解析 layui-vue 组件
+      resolvers: [
+        // @ts-ignore
+        LayuiVueResolver({
+          resolveIcons: true,
+          exclude: [
+            "LaySearch",
+            "LayAnchor",
+            "LayTableBox",
+            "LayCode",
+            "component",
+            "guide",
+            "index",
+            "resource",
+          ],
+        }),
+      ],
+    }),
+    ...plugins,
+  ],
+});