0

What I am trying to do, installing typescript jquery and boostrap definition file in my new project using npm typings.

Below is the steps which I followed.

1- open cmd and goto my currrent project folder and type following commands.

npm install typings --global

typings init

typings install dt~jquery --global --save

typings install dt~boostrap --global --save

2- below is my tsconfig file configuration { "compilerOptions": { "target": "es5", "module": "commonjs", "sourceMap": true, "rootDir": "./TS", "outDir": "./JS", "watch": true } }

Note: I created separate folder for TS file and JS file. So when typescript transpile, it create javascript file in JS directory.

3- Add document.ready function in ts file and write alert when page load

4- Build and run index.html file

Note: I add transpile javascript in head section so there is no need to mention here any code.

Error: In browser console window its shows me below error:

myscript.ts:2 Uncaught ReferenceError: $ is not defined

Here is my repository.

Please help me here. What I am doing wrong to installing jquery in my project.

Ahmer Ali Ahsan
  • 5,636
  • 16
  • 44
  • 81

1 Answers1

2

As far as I can see from your rep - you have forgot to load the actual bootstrap and jquery in your page. The typescript definitions only provide compiletime information for the typescript transpiler about content of thouse libraries. The libraries them self must be loaded in your index.html. You can do it in two ways:

  1. Add a links to the bootstrap and jquery as described in their how to guides. This is simple although not the preferred way to go in the modern world of module based client side applications
  2. Use module loader (like SystemJS). This will require some configuration though. Start by reading their docs, sample config you can find here

Hope this will help you to get started.

Community
  • 1
  • 1
Amid
  • 21,508
  • 5
  • 57
  • 54
  • I'm afraid I can't answer this question. – Amid Sep 21 '16 at 19:34
  • I downvoted because you said " I add javascript external files in head section " even though you clearly don't in the linked repo. SO questions should be self-contained; if they're not self-contained, they should at least be truthful about what's involved in the problem. – Ryan Cavanaugh Sep 21 '16 at 19:45
  • @RyanCavanaugh I mean. I've added transpile javascript in header. Please recheck my question again. I edited it. – Ahmer Ali Ahsan Sep 24 '16 at 09:40
  • @RyanCavanaugh For more clarification I edited my question please again review it and If again you found something is not clear in my question let me know. – Ahmer Ali Ahsan Sep 24 '16 at 09:56