Using Bootstrap & jQueryUI with TypeScript - Getting (TS) Duplicate property 'tooltip'

Question

I have installed jQueryUI & Bootstrap in my .NET MVC project & loaded types for typescript with npm

"devDependencies": {
    "@types/jquery": "3.5.x",
    "@types/jqueryui": "1.12.x",
    "@types/jquery.validation": "1.16.x",
    "@types/bootstrap": "5.1.x"
  }

I am getting following errors while code compilation since 'tooltip' is available in both bootstrap & jQueryUI.

(TS) Duplicate property 'tooltip'

Any ideas how I can use Bootstrap & jQuery with types for typescript.

Does this answer your question? [jQueryUI Tooltips are competing with Twitter Bootstrap](https://stackoverflow.com/questions/13731400/jqueryui-tooltips-are-competing-with-twitter-bootstrap) — Rahatur, Sep 13 '21 at 13:55
No, this is for javascript, I am having issue while using Typescript with types — Chirag Goyal, Sep 14 '21 at 05:44

score 0 · Answer 1 · edited Dec 15 '21 at 10:07

The problem here is not with the package.json dependencies, it would rather be in your tsconfig.json.

I'd recommend removing @types/bootstrap and @types/jqueryui from tsconfig.json.

Instead use import 'bootstrap'; or import 'jquery-ui' (not jqueryui) in the class where you need it's definitions.

The difference between tsconfig and importing manually is that tsconfig would make those types available globally when you might not necessarily need them all the time.

One note though, you may want to add the following to your tsconfig as well as for when you import jqueryui, you won't write import 'jqueryui, instead you will use jquery-ui:

"paths": {
      "jquery-ui": ["node_modules/@types/jqueryui"]
    },

score 0 · Answer 2 · answered Jan 13 '23 at 12:34

I had the same problem when using types for bootstrap "5.1.x" but after I downgraded to v4 the problem seemed to be gone.

The following command:

> npm i "@types/bootstrap@^4"

added "^4.6.2" version to my package.json:

{
  "dependencies": {
    "@types/bootstrap": "^4.6.2",
    "@types/jquery": "^3.5.16",
    "@types/jqueryui": "^1.12.16"
  }
}

Using Bootstrap & jQueryUI with TypeScript - Getting (TS) Duplicate property 'tooltip'

2 Answers2