angular 2 referencing external js file in index.html

In order to include a global library, you have to add the jquery.js file in the scripts array from angular-cli.json:

"scripts": [
  "../node_modules/jquery/dist/jquery.js"
]

After this, restart ng serve if it is already started.


There is a new way to deal with external libraries using @types

In order to install/use jquery, you just need to install it in your project using

npm install --save @types/jquery

and then in tsconfig.json,under types, add its reference accordingly as shown,

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": [ "es2015", "dom" ],
    "noImplicitAny": true,
    "suppressImplicitAnyIndexErrors": true,

    "types": [
      "jquery",    //<<<<-----add here
      "hammerjs",
      "node"
    ]
  }
}

Tags:

Angular