[依赖] 整体架构依赖升级

docs/docs/zh-CN/guide/index.md

@@ -1,5 +0,0 @@
-##### 安装
-
-```
-npm install layui-vue --save
-```

docs/docs/zh-CN/guide/install.md

@@ -0,0 +1,5 @@
+##### 安装
+
+```
+npm install @layui/layui-vue --save
+```

docs/src/layouts/Layout.vue

@@ -17,6 +17,7 @@
       <lay-side>
         <ul class="layui-menu layui-menu-lg">
           <li><router-link to="/zh-CN/guide">介绍</router-link></li>
+          <li><router-link to="/zh-CN/guide/install">安装</router-link></li>
           <li><router-link to="/zh-CN/components/layout">布局</router-link></li>
           <li><router-link to="/zh-CN/components/container">容器</router-link></li>
           <li><router-link to="/zh-CN/components/button">按钮</router-link></li>

docs/src/plugin/demo.ts

@@ -2,10 +2,6 @@ import markdown from 'markdown-it'
 import highlight from './highlight'
 import type Token from 'markdown-it/lib/token'
 
-/**
- * Combine the script content
- * @param {string} script script string
- */
 function assignScript(script: string) {
   const dependencies = {} as Record<string, string[]>
   const attrs = {} as Record<string, string>

docs/src/router/zh-CN.ts

@@ -12,6 +12,11 @@ const zhCN = [
         component: () => import('../../docs/zh-CN/guide/home.md'),
         meta: { title: '介绍' },
       },
+      {
+        path: '/zh-CN/guide/install',
+        component: () => import('../../docs/zh-CN/guide/install.md'),
+        meta: { title: '安装' },
+      },
     ],
   },
   {

docs/src/styles/vars.css

@@ -1,4 +1,3 @@
-/* TODO: rebuild... copy from [vitepress](https://github.com/vuejs/vitepress) */
 :root {
   --c-white: #ffffff;
   --c-black: #000000;
@@ -13,20 +12,6 @@
   --c-brand: #409eff;
   --c-brand-light: #4abf8a;
 
-  /**
-   * Typography
-   * --------------------------------------------------------------------- */
-
-  --font-family-base: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
-    Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
-  --font-family-mono: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-
-  /**
-   * Shadows
-   * --------------------------------------------------------------------- */
-
   --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.06);
   --shadow-2: 0 3px 12px rgba(0, 0, 0, 0.07), 0 1px 4px rgba(0, 0, 0, 0.07);
   --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.08);
@@ -34,7 +19,6 @@
   --shadow-5: 0 18px 56px rgba(0, 0, 0, 0.16), 0 4px 12px rgba(0, 0, 0, 0.16);
 }
 
-/** Fallback Styles */
 :root {
   --c-divider: var(--c-divider-light);
 

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@layui/layui-vue",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "a component library for Vue 3 base on layui-vue",
   "main": "lib/layui-vue.umd.js",
   "module": "lib/layui-vue.es.js",
@@ -38,46 +38,46 @@
   },
   "homepage": "https://gitee.com/Jmysy/layui-vue/blob/master/README.md",
   "peerDependencies": {
-    "vue": "^3.1.2",
+    "vue": "^3.2.19",
     "vue-router": "^4.0.10"
   },
   "dependencies": {
-    "vue": "^3.1.2",
+    "vue": "^3.2.19",
-    "vue-router": "^4.0.10"
+    "vue-router": "^4.0.11"
   },
   "devDependencies": {
-    "@babel/core": "^7.14.0",
+    "@babel/core": "^7.15.5",
-    "@babel/preset-env": "^7.14.0",
+    "@babel/preset-env": "^7.15.6",
-    "@babel/preset-typescript": "^7.13.0",
+    "@babel/preset-typescript": "^7.15.0",
-    "@types/jest": "^26.0.23",
+    "@types/jest": "^26.0.24",
-    "@types/markdown-it": "^12.0.1",
+    "@types/markdown-it": "^12.2.1",
-    "@types/markdown-it-container": "^2.0.3",
+    "@types/markdown-it-container": "^2.0.4",
-    "@typescript-eslint/eslint-plugin": "^4.22.0",
+    "@typescript-eslint/eslint-plugin": "^4.32.0",
-    "@typescript-eslint/parser": "^4.22.0",
+    "@typescript-eslint/parser": "^4.32.0",
-    "@vitejs/plugin-vue": "^1.2.2",
+    "@vitejs/plugin-vue": "^1.9.2",
-    "@vue/compiler-sfc": "^3.1.2",
+    "@vue/compiler-sfc": "^3.2.19",
-    "@vue/server-renderer": "^3.1.1",
+    "@vue/server-renderer": "^3.2.19",
-    "@vue/test-utils": "^2.0.0-rc.6",
+    "@vue/test-utils": "^2.0.0-rc.15",
     "babel-jest": "^26.6.3",
     "escape-html": "^1.0.3",
-    "eslint": "^7.25.0",
+    "eslint": "^7.32.0",
-    "eslint-plugin-prettier": "^3.4.0",
+    "eslint-plugin-prettier": "^3.4.1",
-    "eslint-plugin-vue": "^7.9.0",
+    "eslint-plugin-vue": "^7.18.0",
-    "husky": "^4.3.6",
+    "husky": "^4.3.8",
     "jest": "^26.6.3",
     "lint-staged": "^10.5.4",
     "markdown-it-container": "^3.0.0",
-    "postcss": "^8.2.13",
+    "postcss": "^8.3.8",
     "postcss-preset-env": "^6.7.0",
     "prettier": "2.2.1",
-    "prismjs": "^1.23.0",
+    "prismjs": "^1.25.0",
     "rimraf": "^3.0.2",
-    "rollup-plugin-babel": "^4.4.0",
+    "@rollup/plugin-babel": "^5.3.0",
-    "ts-jest": "^26.5.5",
+    "ts-jest": "^26.5.6",
-    "typescript": "^4.2.4",
+    "typescript": "^4.4.3",
-    "vite": "2.3.7",
+    "vite": "2.5.10",
-    "vite-plugin-md": "^0.6.3",
+    "vite-plugin-md": "^0.6.7",
-    "vue-jest": "^5.0.0-alpha.8"
+    "vue-jest": "^5.0.0-alpha.10"
   },
   "files": [
     "lib",

src/module/badge/index.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup name="LayBadge" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/block/index.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup name="LayBlock" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/button/index.vue

@@ -1,14 +1,19 @@
 <template>
   <button
     class="layui-btn"
-    :class="[type ? 'layui-btn-' + type : '', size ? 'layui-btn-' + size : '',fluid ? 'layui-btn-fluid':'',radius ? 'layui-btn-radius':'']"
+    :class="[
+      type ? 'layui-btn-' + type : '',
+      size ? 'layui-btn-' + size : '',
+      fluid ? 'layui-btn-fluid' : '',
+      radius ? 'layui-btn-radius' : '',
+    ]"
   >
     <slot></slot>
   </button>
 </template>
 
 <script setup name="LayButton" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/col/index.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script setup name="LayCol" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/container/index.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup name="LayContainer" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/icon/index.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script setup name="LayIcon" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/input/index.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script setup name="LayInput" lang="ts">
-import { defineProps, defineEmits } from '@vue/runtime-core'
+import { defineProps, defineEmits } from 'vue'
 
 const props =
   defineProps<{

src/module/line/index.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script setup name="LayLine" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/progress/index.vue

@@ -2,30 +2,30 @@
   <div class="layui-progress" :class="'layui-progress-' + size">
     <div
       class="layui-progress-bar"
-      :class="'layui-bg-' + this.theme"
+      :class="'layui-bg-' + theme"
       :style="[
-        this.color ? 'background-color: ' + this.color : '',
+        color ? 'background-color: ' + color : '',
         {
-          width: this.percent + '%',
+          width: percent + '%',
         },
       ]"
     >
       <span v-if="showText" class="layui-progress-text">
-        {{ text ? text : this.percent + '%' }}
+        {{ text ? text : percent + '%' }}
       </span>
     </div>
   </div>
 </template>
 <script setup name="LayProgress" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{
-    percent: Number
+    percent: number
-    theme: String
+    theme?: string
-    color: String
+    color?: string
-    size: String
+    size?: string
-    showText: Boolean
+    showText?: boolean
-    text: String
+    text?: string
   }>()
 </script>

src/module/radio/index.vue

@@ -27,7 +27,7 @@
 </template>
 
 <script setup name="LayRadio" lang="ts">
-import { defineProps, defineEmits } from '@vue/runtime-core'
+import { defineProps, defineEmits } from 'vue'
 
 const props =
   defineProps<{

src/module/row/index.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script setup name="LayRow" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

src/module/switch/index.vue

@@ -14,7 +14,7 @@
 </template>
 
 <script setup name="LaySwitch" lang="ts">
-import { defineProps, defineEmits } from '@vue/runtime-core'
+import { defineProps, defineEmits } from 'vue'
 
 const props =
   defineProps<{

src/module/textarea/index.vue

@@ -3,7 +3,7 @@
 </template>
 
 <script setup name="LayTextarea" lang="ts">
-import { defineProps, defineEmits } from '@vue/runtime-core'
+import { defineProps, defineEmits } from 'vue'
 
 const props =
   defineProps<{

src/module/timelineItem/index.vue

@@ -14,7 +14,7 @@
 </template>
 
 <script setup name="LayTimelineItem" lang="ts">
-import { defineProps } from '@vue/runtime-core'
+import { defineProps } from 'vue'
 
 const props =
   defineProps<{

vite.config.ts

@@ -1,6 +1,6 @@
 import path from 'path'
 import { defineConfig } from 'vite'
-import babel from 'rollup-plugin-babel'
+import babel from '@rollup/plugin-babel'
 import { name } from './package.json'
 import plugins from './docs/src/plugin/common-plugins'
 
@@ -36,6 +36,7 @@ export default defineConfig({
           presets: ['@babel/preset-env', '@babel/preset-typescript'],
         }),
       ],
+      external : [ 'vue', 'vue-router' ] 
     },
   },
   plugins,