Angular Error on build: 'Please add a @NgModule annotation'

Angular Error on build: 'Please add a @NgModule annotation'

Posted by: kyle.m.vassella on 13 August 2018, 2:11 am EST

• 

  kyle.m.vassella

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 13 August 2018, 2:11 am EST

  Hi,

  I’m using Angular 6 with the latest SpreadJS demo. When trying to build to production, I get the following error:

  ERROR in : Unexpected value 'SpreadSheetsModule in E:/misc/misc2/src/assets/spread/gc.spread.sheets.angular.11.1.3.d.ts' imported by the module 'AppModule in E:/misc/misc2/src/app/app.module.ts'. Please add a @NgModule annotation.
  

  Otherwise, the project works fine, and ng serves work fine. Does anyone know what I can do to fix this and allow Spread to work with Angular 6 AOT compiling?

• 

  grapecity

  • Post Options:
  • Link
    Copy

  Posted 13 August 2018, 8:17 pm EST

  Hello,

  You can copy the Angular Wrapper typescript source file into the project and refer as a file module.

  See attached.

  1. npm install, then copy the gc.spread.sheets.angular.ts (only this file) from node_modules/@grapecity/spread-sheets-angular/dist folder to src/component/spread-sheets-angular folder.

  2. modify the app.module.ts

  // import { SpreadSheetsModule } from “@grapecity/spread-sheets-angular”;
  
  import { SpreadSheetsModule } from “…/component/spread-sheets-angular/gc.spread.sheets.angular”;

  Then use “ng build --prod” to build again.

  Thanks,
  
  Deepak SharmaArchive (1).zip

• 

  mperron

  • Post Options:
  • Link
    Copy

  Posted 21 July 2020, 1:34 am EST

  hello I stumbled across the same problem but I import a lot of grapecity package :

  import * as GC from “@grapecity/spread-sheets”;
  
  import * as Excel from “@grapecity/spread-excelio”;
  
  import “@grapecity/spread-sheets-angular”;
  
  import “@grapecity/spread-sheets-print”;
  
  import “@grapecity/spread-sheets-pdf”;

  build prod sends me these errors :
  
  ERROR in ./node_modules/@grapecity/spread-sheets-angular/dist/gc.spread.sheets.angular.ts
  
  Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
  
  Error: C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the ‘files’ or ‘include’ property.
  
  The missing file seems to be part of a third party library. TS files in published libraries are often a sign of a badly packaged library. Please open an issue in the library repository to alert its author and ask them to package the library using the Angular Package Format (https://goo.gl/jB3GVv).
  
  at AngularCompilerPlugin.getCompiledFile (C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@ngtools\webpack\src\angular_compiler_plugin.js:913:23)
  
  at C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@ngtools\webpack\src\loader.js:41:31
  
  at runMicrotasks ()
  
  at processTicksAndRejections (internal/process/task_queues.js:97:5)
  
  @ ./src/app/app.module.ngfactory.js 140:0-87 147:20126-20149 147:20151-20174
  
  @ ./src/main.ts
  
  @ multi ./src/main.ts
  
  ERROR in ./src/app/spreadsheets/spreadeditor/spreadeditor.component.ngfactory.js
  
  Module not found: Error: Can’t resolve ‘…/…/…/…/node_modules/@grapecity/spread-sheets-angular/dist/gc.spread.sheets.angular.ngfactory’ in ‘C:\VSO_Projects\SpectrAstage1\SpectrA\src\app\spreadsheets\spreadeditor’
  
  resolve ‘…/…/…/…/node_modules/@grapecity/spread-sheets-angular/dist/gc.spread.sheets.angular.ngfactory’ in ‘C:\VSO_Projects\SpectrAstage1\SpectrA\src\app\spreadsheets\spreadeditor’
  
  using description file: C:\VSO_Projects\SpectrAstage1\SpectrA\package.json (relative path: ./src/app/spreadsheets/spreadeditor)
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  using description file: C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\package.json (relative path: ./dist/gc.spread.sheets.angular.ngfactory)
  
  no extension
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory doesn’t exist
  
  .ts
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.ts doesn’t exist
  
  .tsx
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.tsx doesn’t exist
  
  .mjs
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.mjs doesn’t exist
  
  .js
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.js doesn’t exist
  
  as directory
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory doesn’t exist
  
  [C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory]
  
  [C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.ts]
  
  [C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.tsx]
  
  [C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.mjs]
  
  [C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.js]
  
  @ ./src/app/spreadsheets/spreadeditor/spreadeditor.component.ngfactory.js 10:0-120 114:11-42 114:44-79 114:380-408 114:410-442 114:682-707 114:709-738 114:948-973 114:975-1004 114:1214-1239 114:1241-1270 114:1480-1505 114:1507-1536
  
  @ ./src/app/clauses/contentedit/clausecontentedit.component.ngfactory.js
  
  @ ./src/app/clauses/clauseedit.component.ngfactory.js
  
  @ ./src/app/app.module.ngfactory.js
  
  @ ./src/main.ts
  
  @ multi ./src/main.ts
  
  ERROR in ./src/app/spreadsheets/spreadsheetreadonly/spreadsheetreadonly.component.ngfactory.js
  
  Module not found: Error: Can’t resolve ‘…/…/…/…/node_modules/@grapecity/spread-sheets-angular/dist/gc.spread.sheets.angular.ngfactory’ in ‘C:\VSO_Projects\SpectrAstage1\SpectrA\src\app\spreadsheets\spreadsheetreadonly’
  
  resolve ‘…/…/…/…/node_modules/@grapecity/spread-sheets-angular/dist/gc.spread.sheets.angular.ngfactory’ in ‘C:\VSO_Projects\SpectrAstage1\SpectrA\src\app\spreadsheets\spreadsheetreadonly’
  
  using description file: C:\VSO_Projects\SpectrAstage1\SpectrA\package.json (relative path: ./src/app/spreadsheets/spreadsheetreadonly)
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  using description file: C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\package.json (relative path: ./dist/gc.spread.sheets.angular.ngfactory)
  
  no extension
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory doesn’t exist
  
  .ts
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.ts doesn’t exist
  
  .tsx
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.tsx doesn’t exist
  
  .mjs
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.mjs doesn’t exist
  
  .js
  
  Field ‘browser’ doesn’t contain a valid alias configuration
  
  C:\VSO_Projects\SpectrAstage1\SpectrA\node_modules@grapecity\spread-sheets-angular\dist\gc.spread.sheets.angular.ngfactory.js doesn’t exist
  
  as directory

  should I do the same manip for each of these imports ?

  thank you for your help

• 

  manish.gupta

  

  • Post Options:
  • Link
    Copy

  Posted 21 July 2020, 11:54 pm EST

  Hi,
  
  Only moving spread-sheets-angular.ts will be sufficient and it should work fine regardless of no packages used. Further, we are not able to replicate the issue at our end. We have prepared a sample that uses multiple SJS packages please check it from attachment and if the issue persists then please share more information about the issue such as Angular version, SJS version, etc.

  Regards,
  
  Manish Gupta

  AngularApp.zip