"ng serve" gives compilation error #5034

Activity

1. marcelino-m commented on Feb 27, 2017

   

   marcelino-m

   on Feb 27, 2017

   More actions

   I have same issue in linux, but this arises when I use "typeRoots" option in tsconfi.app.json with local type definitions file.

   Randomly fails with the message:

   ERROR in /home/marcelo/lab/ool/nool-w/src/app/app.component.ts (2,23): Cannot find module 'openlayers'.)
   
2. vladotesanovic commented on Feb 27, 2017

   

   vladotesanovic

   on Feb 27, 2017

   More actions

   @marcelino-m

   Don't use typeRoots anymore, here is documentation how to use custom typings:

   Easiest for you is to create src/typings.d.ts file than in that file to import your custom types:

   src/typings.d.ts

   import '../custom_typings/lib1/index';
   import '../custom_typings/lib2/index';

   👍React with 👍1Reacted by Marcelo M. A.
3. akhilbojedla commented on Feb 28, 2017

   

   akhilbojedla

   on Feb 28, 2017

   Author

   More actions

   I figured out the exact issue. The issue is with lazy loading. When I use following route array with PagesModule in imports
   [{ path: '', children: [ { path: 'pages', loadChildren: () => PagesModule }, { path: '', redirectTo: 'pages', pathMatch: 'full' } ] }]

   But works perfectly when I use the following routes array:
   [ { path: '', children: [ { path: 'pages', loadChildren: './pages/pages.module#PagesModule' }, { path: '', redirectTo: 'pages', pathMatch: 'full' } ] } ]
4. marcelino-m commented on Mar 4, 2017

   

   marcelino-m

   on Mar 4, 2017

   More actions

   @vladotesanovic

   Thanks for the help!.
5. doggy8088 commented on Mar 4, 2017

   

   doggy8088

   on Mar 4, 2017

   Contributor

   More actions

   @vladotesanovic Is there any reason why you said Don't use typeRoots anymore?
6. marcelino-m commented on Mar 4, 2017

   

   marcelino-m

   on Mar 4, 2017

   More actions

   @doggy8088
   Here the docs, https://github.com/angular/angular-cli/wiki/stories-third-party-lib
7. doggy8088 commented on Mar 4, 2017

   

   doggy8088

   on Mar 4, 2017

   Contributor

   More actions

   @marcelino-m Thanks.

   In my testing, the npm start unable to compile all my TypeScript file correctly. It just can't include @types correctly.

   Here is the steps to repro the problem.

   1. ng new demo0304 --ng4
   2. cd demo0304
   3. npm install --save-dev @types/jquery
   4. Edit src/app/app.component.ts. Add the following line:

   import { Component } from '@angular/core';
   
   @Component({
     selector: 'app-root',
     templateUrl: './app.component.html',
     styleUrls: ['./app.component.css']
   })
   export class AppComponent {
     title = 'app works!';
     constructor() {
       $.get('');
     }
   }
   

   5. Edit src/tsconfig.app.json

   "types": ["jquery"]
   

   ---

   When you execute npm start, you will get this error:

   

   If I run tsc -p src\tsconfig.app.json, no problem at all.

   In my Visual Studio Code, no problem at all.

   Is that an issue?
8. marcelino-m commented on Mar 4, 2017

   

   marcelino-m

   on Mar 4, 2017

   More actions

   @doggy8088 Hi,

   I think you are missing install jquery. You have just instaled @types/jquery (types definition for jquery)
   not jquery itself.

   Here what I done:

   ng new demo0304 --ng4
   cd demo000304
   npm install --save jquery
   

   Edit app.component.ts (import jquery module)

   import { Component } from '@angular/core';
   import * as $ from 'jquery';
   
   @Component({
     selector: 'app-root',
     templateUrl: './app.component.html',
     styleUrls: ['./app.component.css']
   })
   export class AppComponent {
     title = 'app works!';
     constructor() {
       $.get('');
     }
   }
   

   So run

   ng serve
   

   Run Ok.

   if you wish now you cant install @types/jquery

   npm install --save-dev @types/jquery
   

   Cheers!
9. doggy8088 commented on Mar 5, 2017

   

   doggy8088

   on Mar 5, 2017

   Contributor

   More actions

   @marcelino-m Yes, you are right. It do works using your way to setup jquery.

   In my case, my jquery has already been loaded in the index.html file. I don't want to load it again and bundled with my Angular app. So there is long time, I use jquery by this way which is load @types/jquery only in my app but full jquery library.

   As I mentioned in my original question, my current setup can work as expected in my Visual Studio Code and using tsc standalone. It only show up errors when I using ng serve. I don't know why. Can you tell?
10. doggy8088 commented on Mar 7, 2017

    

    doggy8088

    on Mar 7, 2017

    Contributor

    More actions

    Known issue & PR here: #5251
11. filipesilva commented on Mar 14, 2017

    

    filipesilva

    on Mar 14, 2017

    Contributor

    More actions

    Heya, errors like Error encountered resolving symbol values statically mean that there has been some problem in statically analyzing your app.

    The CLI always runs statical analysis on code to ensure it will run when compiled with AOT. This may cause a lot of static analysis errors to surface when importing your project into the CLI, or upgrading for older versions where we didn't run this kind of analysis.

    A good resource on how to to debug these errors is https://github.com/rangle/angular-2-aot-sandbox#aot-dos-and-donts.

    The other issues brought up seem to be completely unrelated to the original one. Please open new issues and fill out the issue template for them.
12. filipesilva

    closed this as completedon Mar 14, 2017
13. angular-automatic-lock-bot commented on Sep 6, 2019

    

    angular-automatic-lock-botbot

    on Sep 6, 2019

    More actions

    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.}
14. angular-automatic-lock-bot

    locked and limited conversation to collaborators on Sep 6, 2019