Supporting Typescript

[Fream]

Hello, does vue-sidebar-menu support typescript? I found declared types in your project

[yaminncco]

Yes typescript is supported

[yurayakimenko]

Any examples of usage? It's not importing as expected.

[yurayakimenko]

import VueSidebarMenu from 'vue-sidebar-menu'
import 'vue-sidebar-menu/dist/vue-sidebar-menu.css'
Vue.use(VueSidebarMenu)

but got:

Types of property 'install' are incompatible.
          Type 'import("node_modules/vue-sidebar-menu/node_modules/vue/types/plugin").PluginFunction<any>' is not assignable to type 

It's working but typescript is alerting.

[yaminncco]

@yurayakimenko Can you share your package.json

[yurayakimenko]

@yaminncco

{
  "name": "project-name",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@fortawesome/fontawesome-free": "^5.12.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.26",
    "@fortawesome/free-brands-svg-icons": "^5.12.0",
    "@fortawesome/free-regular-svg-icons": "^5.12.0",
    "@fortawesome/free-solid-svg-icons": "^5.12.0",
    "@fortawesome/vue-fontawesome": "^0.1.8",
    "@types/vue-moment": "^4.0.0",
    "@types/vue-select": "^2.5.0",
    "@types/vuedraggable": "^2.23.0",
    "@types/vuelidate": "^0.7.11",
    "axios": "^0.19.0",
    "bootstrap-vue": "^2.1.0",
    "core-js": "^3.4.3",
    "node-sass": "^4.13.1",
    "pug": "^2.0.4",
    "pug-plain-loader": "^1.0.0",
    "sass-loader": "^8.0.2",
    "v-clipboard": "^2.2.2",
    "vue": "^2.6.10",
    "vue-bootstrap-datetimepicker": "^5.0.1",
    "vue-chartjs": "^3.5.0",
    "vue-chartjs-typescript": "^3.3.3",
    "vue-class-component": "^7.0.2",
    "vue-clipboard2": "^0.3.1",
    "vue-cookies-ts": "^1.5.19",
    "vue-facebook-signin-button": "^1.0.1",
    "vue-google-oauth2": "^1.4.0",
    "vue-google-signin-button": "^1.0.4",
    "vue-loader": "^15.7.2",
    "vue-moment": "^4.1.0",
    "vue-multiselect": "^2.0.3",
    "vue-notification": "^1.3.20",
    "vue-promised": "^1.2.2",
    "vue-property-decorator": "^8.3.0",
    "vue-router": "^3.1.3",
    "vue-select": "^3.4.0",
    "vue-sidebar-menu": "^4.5.3",
    "vue-telegram-login": "^2.1.0",
    "vue2-dropzone": "^3.6.0",
    "vuedraggable": "^2.23.2",
    "vuelidate": "^0.7.5",
    "vuex": "^3.1.2",
    "vuex-module-decorators": "^0.11.0",
    "vuex-persist": "^2.2.0",
    "vuex-persistedstate": "^2.7.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^4.1.0",
    "@vue/cli-plugin-eslint": "^4.1.0",
    "@vue/cli-plugin-router": "^4.1.0",
    "@vue/cli-plugin-typescript": "^4.1.0",
    "@vue/cli-plugin-vuex": "^4.1.0",
    "@vue/cli-service": "^4.1.0",
    "@vue/eslint-config-typescript": "^4.0.0",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "typescript": "~3.5.3",
    "vue-template-compiler": "^2.6.10"
  }
}

[yaminncco]

@yurayakimenko any issue if you use the component locally? can you show tsconfig

[yurayakimenko]

Same issue if using locally.

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.tsx",
    "src/**/*.vue",
    "tests/**/*.ts",
    "tests/**/*.tsx"
  ],
  "exclude": [
    "node_modules"
  ]
}

[yaminncco]

can you reproduce the issue on a fresh install