fix: build error

examples/layouts/BasicLayout.vue

@@ -69,7 +69,7 @@
 
     <!-- content begin -->
     <router-view v-slot="{ Component }">
-      <WaterMark content="Pro Layout">
+      <WaterMark :content="watermarkContent">
         <component :is="Component" />
       </WaterMark>
     </router-view>
@@ -105,7 +105,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, reactive, ref, watchEffect } from 'vue';
+import { computed, defineComponent, reactive, ref, watchEffect, onMounted } from 'vue';
 import { useRouter } from 'vue-router';
 import { message, Button, Input, Switch, Select, Avatar, Space, Badge, Menu } from 'ant-design-vue';
 import { getMenuData, clearMenuItem, WaterMark, FooterToolbar } from '@ant-design-vue/pro-layout';
@@ -132,7 +132,7 @@ export default defineComponent({
   },
   setup() {
     const loading = ref(false);
-
+    const watermarkContent = ref('Pro Layout');
     const router = useRouter();
     const { menuData } = getMenuData(clearMenuItem(router.getRoutes()));
 
@@ -181,8 +181,15 @@ export default defineComponent({
       }, 2000);
     }
 
+    onMounted(() => {
+      setTimeout(() => {
+        watermarkContent.value = 'New Mark';
+      }, 2000);
+    });
+
     return {
       i18n,
+      watermarkContent,
       baseState,
       state,
       loading,

examples/router.ts

 import { createRouter, createWebHistory } from 'vue-router';
 import type { RouteRecordRaw } from 'vue-router';
-import BasicLayout from './layouts/CustomLayout.vue';
+import BasicLayout from './layouts/BasicLayout.vue';
 import RouteView from './layouts/RouteView.vue';
 
 const routes: RouteRecordRaw[] = [

package.json

@@ -26,7 +26,7 @@
   ],
   "scripts": {
     "dev": "vite",
-    "build": "vue-tsc --noEmit && vite build",
+    "build": "vue-tsc --noEmit && vite build && tsc -b --force tsconfig.esm.json",
     "serve": "vite preview",
     "build:types": "tsc -b --force tsconfig.esm.json"
   },
@@ -41,7 +41,8 @@
     "lodash-es": "^4.17.21",
     "omit.js": "^2.0.2",
     "vue": "^3.2.22",
-    "vue-router": "^4.0.12"
+    "vue-router": "^4.0.12",
+    "vue-types": "^4.1.1"
   },
   "devDependencies": {
     "@ant-design/icons-vue": "^6.0.1",
@@ -61,7 +62,6 @@
     "fs-extra": "^10.0.0",
     "less": "^4.1.2",
     "prettier": "^2.4.1",
-    "tsc": "^2.0.3",
     "typescript": "^4.4.4",
     "vite": "^2.6.14",
     "vue-tsc": "^0.3.0"

pnpm-lock.yaml

@@ -21,12 +21,12 @@ specifiers:
   lodash-es: ^4.17.21
   omit.js: ^2.0.2
   prettier: ^2.4.1
-  tsc: ^2.0.3
   typescript: ^4.4.4
   vite: ^2.6.14
   vue: ^3.2.22
   vue-router: ^4.0.12
   vue-tsc: ^0.3.0
+  vue-types: ^4.1.1
 
 dependencies:
   ant-design-vue: 2.2.8_d993d7eb47a5c30940fe6565e4c82216
@@ -34,6 +34,7 @@ dependencies:
   omit.js: 2.0.2
   vue: 3.2.22
   vue-router: 4.0.12_vue@3.2.22
+  vue-types: 4.1.1_vue@3.2.22
 
 devDependencies:
   '@ant-design/icons-vue': 6.0.1_vue@3.2.22
@@ -53,7 +54,6 @@ devDependencies:
   fs-extra: 10.0.0
   less: 4.1.2
   prettier: 2.4.1
-  tsc: 2.0.3
   typescript: 4.4.4
   vite: 2.6.14_less@4.1.2
   vue-tsc: 0.3.0_typescript@4.4.4
@@ -1971,6 +1971,11 @@ packages:
     engines: {node: '>=0.10.0'}
     dev: false
 
+  /is-plain-object/5.0.0:
+    resolution: {integrity: sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==}
+    engines: {node: '>=0.10.0'}
+    dev: false
+
   /is-promise/2.2.2:
     resolution: {integrity: sha512-+lP4/6lKUBfQjZ2pdxThZvLUAafmZb8OAxFb8XXtiQmS35INgr85hdOGoEs124ez1FCnZJt6jau/T+alh58QFQ==}
     dev: true
@@ -2768,11 +2773,6 @@ packages:
     resolution: {integrity: sha1-zCAOqyYT9BZtJ/+a/HylbUnfbrQ=}
     dev: true
 
-  /tsc/2.0.3:
-    resolution: {integrity: sha512-SN+9zBUtrpUcOpaUO7GjkEHgWtf22c7FKbKCA4e858eEM7Qz86rRDpgOU2lBIDf0fLCsEg65ms899UMUIB2+Ow==}
-    hasBin: true
-    dev: true
-
   /tsconfig-paths/3.11.0:
     resolution: {integrity: sha512-7ecdYDnIdmv639mmDwslG6KQg1Z9STTz1j7Gcz0xa+nshh/gKDAHcPxRbWOsA3SPp0tXP2leTcY9Kw+NAkfZzA==}
     dependencies:
@@ -3040,6 +3040,16 @@ packages:
       vue: 3.2.22
     dev: false
 
+  /vue-types/4.1.1_vue@3.2.22:
+    resolution: {integrity: sha512-Jq2GZ/w6rExJbLA/h7nHBFLciu+YNekgox0DB64wN1snZ4IIJMq+qnqp1/vE4fc7vEjZcP5KGhLzkkSjIHLRzw==}
+    engines: {node: '>=12.16.0'}
+    peerDependencies:
+      vue: ^2.0.0 || ^3.0.0
+    dependencies:
+      is-plain-object: 5.0.0
+      vue: 3.2.22
+    dev: false
+
   /vue/3.2.22:
     resolution: {integrity: sha512-KD5nZpXVZquOC6926Xnp3zOvswrUyO9Rya7ZUoxWFQEjFDW4iACtwzubRB4Um2Om9kj6CaJOqAVRDSFlqLpdgw==}
     dependencies:

src/SiderMenu/SiderMenu.tsx

@@ -15,7 +15,8 @@ import { WithFalse, CustomRender } from '../typings';
 import { SiderProps } from './typings';
 import { defaultSettingProps } from '../defaultSettings';
 import { useRouteContext } from '../RouteContext';
-import { PropTypes, getMenuFirstChildren } from '../utils';
+import PropTypes from 'vue-types';
+
 import './index.less';
 
 const { Sider } = Layout;
@@ -66,15 +67,11 @@ export const siderMenuProps = {
     type: [Object, Boolean] as PropType<SiderProps['breakpoint'] | false>,
     default: () => false,
   },
-  isMobile: PropTypes.looseBool,
-  splitMenus: PropTypes.looseBool,
-  fixed: PropTypes.looseBool,
-  hide: PropTypes.looseBool,
-  matchMenuKeys: {
-    type: Array as PropType<string[]>,
-    default: () => [],
-  },
-
+  isMobile: PropTypes.bool,
+  splitMenus: PropTypes.bool,
+  fixed: PropTypes.bool,
+  hide: PropTypes.bool,
+  matchMenuKeys: PropTypes.array<string>(),
   // events
   onMenuHeaderClick: PropTypes.func,
   onMenuClick: PropTypes.func,

src/utils/index.ts

 import { Slots } from 'vue';
 import type { RouteRecord, RouteRecordRaw } from 'vue-router';
-import PropTypes from 'ant-design-vue/es/_util/vue-types';
+// import PropTypes from 'ant-design-vue/es/_util/vue-types';
+import PropTypes from 'vue-types';
 import { MenuDataItem } from '../typings';
 
 export { default as isUrl } from './isUrl';

src/vite-env.d.ts

 /// <reference types="vite/client" />
+
+declare module 'vue-types' {
+  import * as VueTypes from 'vue-types/index';
+
+  export default VueTypes;
+}

vite.config.ts

@@ -32,6 +32,7 @@ export default defineConfig({
         'vue',
         'vue-router',
         '@ant-design/icons-vue',
+        '@ant-design/icons-svg',
         'ant-design-vue',
         'antd',
         'moment',
@@ -45,6 +46,7 @@ export default defineConfig({
           'vue-router': 'VueRouter',
           'ant-design-vue': 'antDesignVue',
           '@ant-design/icons-vue': 'iconsVue',
+          '@ant-design/icons-svg': 'iconsSvg',
           'antd': 'antd',
           moment: 'moment',
         },