Mr.Moe Mr.Moe - 1 year ago 98
AngularJS Question

Including custom none npm js files into angular 2

The application I build at the moment runs in an

angular 2.0.0 final
environment using typescript. Furthermore it uses the
angular-cli 1.0.0-beta.15

As the whole application is produced by several different developers (all using
) I get some
files that are compiled from
and should be included and used in my angular 2 app.

My problem however is, that I can't seem to find a way to integrate the
file and use it in e.g. a component.

I allready checked this SO question as well as this question in the official repo but neither of these answers worked for me.

I even tried a workaround where I include the
file globally in the
like this:

"scripts": [

How can I (generally and specifically for this scenario) include custom .js files which do not come as e.g.
module or have any


The including itself by using the
seems to work well but for now I still could not find a way to use the scripts methods. Whenever I do

declare var customJsObject: any;

It throws an

EXCEPTION: Uncaught (in promise):
Error: Error in CustomComponent caused by: customJsObject is not defined

Answer Source

From my project:

"project" : {
    "version": "1.0.0-beta.15",
    "name"   : "my-project"
"apps"    : [
        "root"        : "src",
        "outDir"      : "dist",
        "assets"      : "assets",
        "index"       : "index.html",
        "main"        : "main.ts",
        "test"        : "test.ts",
        "tsconfig"    : "tsconfig.json",
        "prefix"      : "",
        "mobile"      : false,
        "styles"      : [
        "scripts"     : [
        "environments": {
            "source": "environments/environment.ts",
            "dev"   : "environments/environment.ts",
            "prod"  : "environments/"
"addons"  : [],
"packages": [],
"e2e"     : {
    "protractor": {
        "config": "./protractor.conf.js"
"test"    : {
    "karma": {
        "config": "./karma.conf.js"
"defaults": {
    "styleExt"        : "scss",
    "prefixInterfaces": false

Solution Edit:

For this specific problem there was a naming issue which caused the problem. In general the provided answer "entering the script in the angular-cli.json" was correct.

The only thing one need to do afterwards is

declare var customJsObject: any;

in the component you want to use the custom.js in.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download