From d1f3cbe0aa688b3e999f980bd4525f61df842da9 Mon Sep 17 00:00:00 2001 From: Thomas Date: Fri, 8 Apr 2022 23:34:42 -0500 Subject: [PATCH] Added draggable and router --- package.json | 5 ++- pnpm-lock.yaml | 84 ++++++++++++++++++++++++++++++++++++++ src/App.vue | 13 +++++- src/components/Sidebar.vue | 10 +++++ src/main.ts | 7 +++- 5 files changed, 115 insertions(+), 4 deletions(-) create mode 100644 src/components/Sidebar.vue diff --git a/package.json b/package.json index 87bdc46..9d1524f 100644 --- a/package.json +++ b/package.json @@ -11,9 +11,12 @@ "preview": "vite preview" }, "dependencies": { - "vue": "^3.2.25" + "install": "^0.13.0", + "vue": "^3.2.25", + "vue-router": "^4.0.14" }, "devDependencies": { + "@braks/revue-draggable": "^0.4.2", "@typescript-eslint/eslint-plugin": "^5.18.0", "@typescript-eslint/parser": "^5.18.0", "@vitejs/plugin-vue": "^2.3.1", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 50e4c3a..cedd77f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -1,20 +1,26 @@ lockfileVersion: 5.3 specifiers: + '@braks/revue-draggable': ^0.4.2 '@typescript-eslint/eslint-plugin': ^5.18.0 '@typescript-eslint/parser': ^5.18.0 '@vitejs/plugin-vue': ^2.3.1 '@volar/vue-language-service': ^0.33.9 eslint: ^8.13.0 + install: ^0.13.0 typescript: ^4.5.4 vite: ^2.9.0 vue: ^3.2.25 + vue-router: ^4.0.14 vue-tsc: ^0.33.9 dependencies: + install: 0.13.0 vue: 3.2.31 + vue-router: 4.0.14_vue@3.2.31 devDependencies: + '@braks/revue-draggable': 0.4.2_vue@3.2.31 '@typescript-eslint/eslint-plugin': 5.18.0_0dd9be2ba5ed9805045f3fec8be848f5 '@typescript-eslint/parser': 5.18.0_eslint@8.13.0+typescript@4.6.3 '@vitejs/plugin-vue': 2.3.1_vite@2.9.1+vue@3.2.31 @@ -60,6 +66,20 @@ packages: to-fast-properties: 2.0.0 dev: true + /@braks/revue-draggable/0.4.2_vue@3.2.31: + resolution: {integrity: sha512-PfGYOs+uhyQnY8RmSfJDI5o2ZgUH2UY3OT/eoS1F0echNrVDNyyh6dNW9YX9dZO2boQPVZC3RjcFnCUG9Lj4xw==} + peerDependencies: + '@vue/composition-api': ^1.0.0-rc.1 + vue: ^2.0.0 || >=3.0.5 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + dependencies: + '@vueuse/core': 7.7.1_vue@3.2.31 + vue: 3.2.31 + vue-demi: 0.12.5_vue@3.2.31 + dev: true + /@emmetio/abbreviation/2.2.3: resolution: {integrity: sha512-87pltuCPt99aL+y9xS6GPZ+Wmmyhll2WXH73gG/xpGcQ84DRnptBsI2r0BeIQ0EB/SQTOe2ANPqFqj3Rj5FOGA==} dependencies: @@ -596,6 +616,10 @@ packages: '@vue/compiler-dom': 3.2.31 '@vue/shared': 3.2.31 + /@vue/devtools-api/6.1.4: + resolution: {integrity: sha512-IiA0SvDrJEgXvVxjNkHPFfDx6SXw0b/TUkqMcDZWNg9fnCAHbTpoo59YfJ9QLFkwa3raau5vSlRVzMSLDnfdtQ==} + dev: false + /@vue/reactivity-transform/3.2.31: resolution: {integrity: sha512-uS4l4z/W7wXdI+Va5pgVxBJ345wyGFKvpPYtdSgvfJfX/x2Ymm6ophQlXXB6acqGHtXuBqNyyO3zVp9b1r0MOA==} dependencies: @@ -638,6 +662,37 @@ packages: /@vue/shared/3.2.31: resolution: {integrity: sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==} + /@vueuse/core/7.7.1_vue@3.2.31: + resolution: {integrity: sha512-PRRgbATMpoeUmkCEBtUeJgOwtew8s+4UsEd+Pm7MhkjL2ihCNrSqxNVtM6NFE4uP2sWnkGcZpCjPuNSxowJ1Ow==} + peerDependencies: + '@vue/composition-api': ^1.1.0 + vue: ^2.6.0 || ^3.2.0 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + vue: + optional: true + dependencies: + '@vueuse/shared': 7.7.1_vue@3.2.31 + vue: 3.2.31 + vue-demi: 0.12.5_vue@3.2.31 + dev: true + + /@vueuse/shared/7.7.1_vue@3.2.31: + resolution: {integrity: sha512-rN2qd22AUl7VdBxihagWyhUNHCyVk9IpvBTTfHoLH9G7rGE552X1f+zeCfehuno0zXif13jPw+icW/wn2a0rnQ==} + peerDependencies: + '@vue/composition-api': ^1.1.0 + vue: ^2.6.0 || ^3.2.0 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + vue: + optional: true + dependencies: + vue: 3.2.31 + vue-demi: 0.12.5_vue@3.2.31 + dev: true + /acorn-jsx/5.3.2_acorn@8.7.0: resolution: {integrity: sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==} peerDependencies: @@ -1897,6 +1952,11 @@ packages: resolution: {integrity: sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==} dev: true + /install/0.13.0: + resolution: {integrity: sha512-zDml/jzr2PKU9I8J/xyZBQn8rPCAY//UOYNmR01XwNwyfhEWObo2SWfSl1+0tm1u6PhxLwDnfsT/6jB7OUxqFA==} + engines: {node: '>= 0.10'} + dev: false + /is-alphabetical/1.0.4: resolution: {integrity: sha512-DwzsA04LQ10FHTZuL0/grVDk4rFoVH1pjAToYwBrHSxcrBIGQuXrQMtD5U1b0U2XVgKZCTLLP8u2Qxqhy3l2Vg==} dev: true @@ -3550,6 +3610,30 @@ packages: resolution: {integrity: sha512-EcswR2S8bpR7fD0YPeS7r2xXExrScVMxg4MedACaWHEtx9ftCF/qHG1xGkolzTPcEmjTavCQgbVzHUIdTMzFGA==} dev: true + /vue-demi/0.12.5_vue@3.2.31: + resolution: {integrity: sha512-BREuTgTYlUr0zw0EZn3hnhC3I6gPWv+Kwh4MCih6QcAeaTlaIX0DwOVN0wHej7hSvDPecz4jygy/idsgKfW58Q==} + engines: {node: '>=12'} + hasBin: true + requiresBuild: true + peerDependencies: + '@vue/composition-api': ^1.0.0-rc.1 + vue: ^3.0.0-0 || ^2.6.0 + peerDependenciesMeta: + '@vue/composition-api': + optional: true + dependencies: + vue: 3.2.31 + dev: true + + /vue-router/4.0.14_vue@3.2.31: + resolution: {integrity: sha512-wAO6zF9zxA3u+7AkMPqw9LjoUCjSxfFvINQj3E/DceTt6uEz1XZLraDhdg2EYmvVwTBSGlLYsUw8bDmx0754Mw==} + peerDependencies: + vue: ^3.2.0 + dependencies: + '@vue/devtools-api': 6.1.4 + vue: 3.2.31 + dev: false + /vue-tsc/0.33.9_typescript@4.6.3: resolution: {integrity: sha512-s/+r4JNsCh4e3MUdsYrjEA8IgPPDzHL5kEah/OznxIHd1XMlYiIkXGdiyU6JE5J+lzXNOKdOlNliqwwpeETQWw==} hasBin: true diff --git a/src/App.vue b/src/App.vue index df4e2d7..a4c4224 100644 --- a/src/App.vue +++ b/src/App.vue @@ -5,8 +5,16 @@ import HelloWorld from './components/HelloWorld.vue' diff --git a/src/components/Sidebar.vue b/src/components/Sidebar.vue new file mode 100644 index 0000000..77155ab --- /dev/null +++ b/src/components/Sidebar.vue @@ -0,0 +1,10 @@ + + + diff --git a/src/main.ts b/src/main.ts index 01433bc..232a9b3 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,4 +1,9 @@ import { createApp } from 'vue' import App from './App.vue' +import Draggable, { DraggablePlugin, DraggableDirective } from '@braks/revue-draggable' -createApp(App).mount('#app') + +const app = createApp(App) + +app.use(DraggablePlugin) +app.mount('#app')