VUE - jquery.ui was not found

[seydx]

Subject of the issue

Hi all, I am trying to import "gridstack-dd-jqueryui" into my vue project as described in the readme, but I always get the error message that "jquery.ui" could not be found. What am I doing wrong?

Note:

With gridstack-dd-nativeeverything works, but i need the mobile touch support.

Your environment

OS: macOS v10.15.7
Gridstack version: v4.0.3
Browser: Google Chrome v89.0.4389.90
vue: v2.6.11

Steps to reproduce

import "gridstack/dist/gridstack.min.css";
import { GridStack } from "gridstack";
import "gridstack/dist/jq/gridstack-dd-jqueryui";

Expected behavior

Should find jquery.ui

Actual behavior

[Justin99b]

Same here
I tried to fix it but did not work
using Vue 3.x

[seydx]

Same here
I tried to fix it but did not work
using Vue 3.x

Which version? and how do u added it to your project?

[Justin99b]

I am using Vue CLI
vue 3.0.11
i used yarn add gridstack to add it to my project
tried everything on google but i guess im to stupid to fix it.

[seydx]

I am using Vue CLI
vue 3.0.9
i used yarn add gridstack to add it to my project
tried everything on google but i guess im to stupid to fix it.

nvm, with following code it works also with latest version

import "gridstack/dist/gridstack.min.css";
import GridStack from "gridstack/dist/gridstack-jq.js";

[Justin99b]

src/components/StorageContainer.vue:13:23
TS7016: Could not find a declaration file for module 'gridstack/dist/gridstack-jq.js'. 'c:/Users/Justin/Desktop/FiveM/BetterDevelopment/Neuer Ordner/test/node_modules/gridstack/dist/gridstack-jq.js' implicitly has an 'any' type.
  Try `npm i --save-dev @types/gridstack` if it exists or add a new declaration (.d.ts) file containing `declare module 'gridstack/dist/gridstack-jq.js';`
    11 | <script lang="ts">
    12 | import {Options, Vue} from 'vue-class-component';
  > 13 | import GridStack from "gridstack/dist/gridstack-jq.js";
       |                       ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    14 | import {StorageContainer} from "@/classes/StorageContainer";
    15 | import GridStackItemComponent from "@/components/GridStackItem.vue";
    16 |

Weird i only get this error

[adumesny]

Update: I was in the wrong mood last night when I saw this. I see the doc (which I pasted below) mentions this... never mind, I'll take a look.

Also there are Vue 3 examples if you didn't see them.

[Justin99b]

I actually have this issue even tho i did it like in the documentation

Failed to compile.

./node_modules/gridstack/dist/jq/jquery.ui.touch-punch.js
Module not found: Error: Can't resolve 'jquery.ui' in 'c:\Users\Justin\Desktop\FiveM\BetterDevelopment\Neuer Ordner\test\node_modules\gridstack\dist\jq'

[Justin99b]

Update: I was in the wrong mood last night when I saw this. I see the doc (which I pasted below) mentions this... never mind, I'll take a look.

Also there are Vue 3 examples if you didn't see them.

We all have those kind of days no worries :)

Yes i saw the Vue3 Examples in Javascript

The only problem is that we cant import the Typescript Gridstack lib because of the mentioned error

note1: I deleted my previous answeres to keep it clean!
note2: I think you forgot to change the tags