angular-cli sample project build errors

[_ar_Member]

I am following the link.
https://www.jqwidgets.com/angular-components-documentation/documentation/angular-cli/angular-cli.htm?search=

Version 6 does not have tsconfig.json. It has tsconfig.app.json. I still followed the steps from the above link and made the changes to the tsconfig.app.json.

npm run build gives the following errors

> jqwidgets-angular-cli-app@0.0.0 build e:\javascript\jqwidgets-angular-cli-app
> ng build

Date: 2018-06-20T13:54:11.841Z
Hash: 4e5f8278ab92bada50ba
Time: 3291ms
chunk {main} main.js, main.js.map (main) 630 bytes [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 685 bytes [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 5.22 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 333 kB [initial] [rendered]

ERROR in error TS6053: File ‘e:/javascript/jqwidgets-angular-cli-app/src/node_modules/jqwidgets
-scripts/jqwidgets-ts/angular_jqxbargauge.ts’ not found.

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! jqwidgets-angular-cli-app@0.0.0 build: ng build
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the jqwidgets-angular-cli-app@0.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output abo
ve.

npm ERR! A complete log of this run can be found in:

Env: ng -version

Angular CLI: 6.0.8
Node: 8.10.0
OS: win32 x64
Angular: 6.0.5
… animations, common, compiler, compiler-c
… http, language-service, platform-browser
… platform-browser-dynamic, router

Package Version
——————————————–
@angular-devkit/architect 0.6.8
@angular-devkit/build-angular 0.6.8
@angular-devkit/build-optimizer 0.6.8
@angular-devkit/core 0.6.8
@angular-devkit/schematics 0.6.8
@angular/cli 6.0.8
@ngtools/webpack 6.0.8
@schematics/angular 0.6.8
@schematics/update 0.6.8
rxjs 6.2.1
typescript 2.7.2
webpack 4.8.3

[MartinParticipant]

Hello rajesh.gupta,

After runnning the ng new jqwidgets-angular-cli-app command with version 6.0.8 of Angular CLI you should have the following files created:

CREATE jqwidgets-angular-cli-app/angular.json (3719 bytes)
CREATE jqwidgets-angular-cli-app/package.json (1329 bytes)
CREATE jqwidgets-angular-cli-app/README.md (1039 bytes)
CREATE jqwidgets-angular-cli-app/tsconfig.json (384 bytes)
CREATE jqwidgets-angular-cli-app/tslint.json (2805 bytes)
CREATE jqwidgets-angular-cli-app/.editorconfig (245 bytes)
CREATE jqwidgets-angular-cli-app/.gitignore (503 bytes)
CREATE jqwidgets-angular-cli-app/src/environments/environment.prod.ts (51 bytes)
CREATE jqwidgets-angular-cli-app/src/environments/environment.ts (631 bytes)
CREATE jqwidgets-angular-cli-app/src/favicon.ico (5430 bytes)
CREATE jqwidgets-angular-cli-app/src/index.html (309 bytes)
CREATE jqwidgets-angular-cli-app/src/main.ts (370 bytes)
CREATE jqwidgets-angular-cli-app/src/polyfills.ts (3194 bytes)
CREATE jqwidgets-angular-cli-app/src/test.ts (642 bytes)
CREATE jqwidgets-angular-cli-app/src/assets/.gitkeep (0 bytes)
CREATE jqwidgets-angular-cli-app/src/styles.css (80 bytes)
CREATE jqwidgets-angular-cli-app/src/browserslist (375 bytes)
CREATE jqwidgets-angular-cli-app/src/karma.conf.js (964 bytes)
CREATE jqwidgets-angular-cli-app/src/tsconfig.app.json (194 bytes)
CREATE jqwidgets-angular-cli-app/src/tsconfig.spec.json (282 bytes)
CREATE jqwidgets-angular-cli-app/src/tslint.json (314 bytes)
CREATE jqwidgets-angular-cli-app/src/app/app.module.ts (314 bytes)
CREATE jqwidgets-angular-cli-app/src/app/app.component.html (1141 bytes)
CREATE jqwidgets-angular-cli-app/src/app/app.component.spec.ts (1008 bytes)
CREATE jqwidgets-angular-cli-app/src/app/app.component.ts (207 bytes)
CREATE jqwidgets-angular-cli-app/src/app/app.component.css (0 bytes)
CREATE jqwidgets-angular-cli-app/e2e/protractor.conf.js (752 bytes)
CREATE jqwidgets-angular-cli-app/e2e/src/app.e2e-spec.ts (321 bytes)
CREATE jqwidgets-angular-cli-app/e2e/src/app.po.ts (208 bytes)
CREATE jqwidgets-angular-cli-app/e2e/tsconfig.e2e.json (213 bytes)

There is tsconfig.json file in the jqwidgets-angular-cli-app folder. This is the file that you should change.
The tsconfig.app.json file that you mention is in the src folder instead.

Here is how your tsconfig.json should look like after you change it:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2017",
      "dom"
    ]
  },
    "include": [
      "src/**/*"
    ],
  "files": [
    "src/app/app.module.ts",
    "node_modules/jqwidgets-scripts/jqwidgets-ts/angular_jqxbargauge.ts"
  ]
}

After following also the other steps from our ‘Angular CLI with jQWidgets’ guide, you should be able to build the project without any errors.

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[Author]

Posts