Including external js with allowJs for Angular 5

Versions

Angular CLI: 1.6.1

Angular CLI: 1.6.1 Node: 9.3.0 OS: win32 x64 Angular: 5.2.0 … animations, common, compiler, compiler-cli, core, forms … http, language-service, platform-browser … platform-browser-dynamic, router

@angular/cli: 1.6.1 @angular-devkit/build-optimizer: 0.0.38 @angular-devkit/core: 0.0.25 @angular-devkit/schematics: 0.0.48 @ngtools/json-schema: 1.1.0 @ngtools/webpack: 1.9.1 @schematics/angular: 0.1.13 @schematics/schematics: 0.0.13 typescript: 2.4.2 webpack: 3.10.0

Repro steps

• Step 1 ng new AppName

• Step 2 npm jsplumb install --save

• Step 3 Add import to angular-cli “styles”: [ “…/node_modules/jsplumb/dist/css/jsplumbtoolkit-defaults.css”, “styles.css”
  ],

  and
  
  "scripts": ["../node_modules/jsplumb/dist/js/jsplumb.js"],
  

• Step 4 Include jsplumb in app.component.ts import { jsPlumb } from ‘…/…/…/node_modules/jsplumb/dist/js/jsplumb.js’;

• Step 5 ng build or ng serve to compile and/or build application.

Observed behavior

With the first build without any configuration to tsconfig.json I get the following error.

ERROR in src/app/jsplumb/jsplumb.component.ts(4,25): error TS6143: Module '../../../node_modules/jsplumb/dist/js/jsplumb.js' was resolved to 'D:/myproj/angular5/myapp/node_modules/jsplumb/dist/js/jsplumb.js', but '--allowJs' is not set. With “allowJs”:true in the tsconfig.json get the following error

ERROR in error TS5055: Cannot write file 'D:/myproj/angular5/myapp/node_modules/jsplumb/dist/js/jsplumb.js' because it would overwrite input file.
  Adding a tsconfig.json file will help organize projects that contain both TypeScript and JavaScript files. Learn more at https://aka.ms/tsconfig.

### Desired behavior
<!--
What would like to see implemented?
What is the usecase?
What did you expect to see?
-->
Should build angular application with external js file.

### Mention any other details that might be useful (optional)
tsconfig.json
{
  "compileOnSave": false,
  "compilerOptions": {
    "allowJs":true,
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  }
}

[Stackoverflow ](https://stackoverflow.com/questions/48219888/issue-adding-third-party-external-js-lib-in-angular5)

[ameya]

I have tested out the newer version of cli that is 1.6.8 but still, the issue is not resolved. Followed the steps mentioned in this link to upgrade

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}