Make Angular Material work in offline compiler #774

Activity

1. jelbourn

   added

   P1Impacts a large percentage of users; if a workaround exists it is partial or overly painfulImpacts a large percentage of users; if a workaround exists it is partial or overly painful

   on Jun 27, 2016
2. jelbourn

   added this to the alpha.7 milestone on Jun 27, 2016
3. jelbourn

   assigned

   jelbourn

   and

   hansl

   on Jun 27, 2016
4. luisfurnas commented on Aug 30, 2016

   

   luisfurnas

   on Aug 30, 2016

   More actions

   When trying to offline compile my Angular app, I get this error:

   Error encountered resolving symbol values statically. Reference to a local (non-exported) symbol 'coreModules'.

   I'm trying to use the MdTooltipModule in my bootstrap module, but it doesn't compile 👎
5. cyrilletuzi commented on Sep 13, 2016

   

   cyrilletuzi

   on Sep 13, 2016

   Last edited by cyrilletuzi

   Contributor

   More actions

   (edit : corrected the issue number)

   #883 has been closed as a duplicate of this issue, but I don't think they are the same.

   I'm running an app with AoT offline compiler and Material modules (icon, button, card, input, menu, toolbar), and it's working very well.

   But it is not working with Universal. I get the same "window is not defined" error, as mentioned in #883.

   After a quick look at the code, Material umd bundles are full of reference to "window". Is that normal ?
6. orangesoup commented on Sep 14, 2016

   

   orangesoup

   on Sep 14, 2016

   More actions

   @cyrilletuzi I'm trying to work with Universal as well, no luck so far. You can bypass the window error by putting var window = undefined in those umd bundles, but after that I ran into an issue:

   /.../node_modules/@angular2-material/core/ripple/ripple.js:10
   import { NgModule, Directive, ElementRef, HostBinding, Input } from '@angular/core';
   ^^^^^^
   SyntaxError: Unexpected token import
   

   I'm really not a webpack/node guy, but it's probably just a configuration issue, although I really can't find out what I should do. Any idea?
7. cyrilletuzi commented on Sep 14, 2016

   

   cyrilletuzi

   on Sep 14, 2016

   Last edited by cyrilletuzi

   Contributor

   More actions

   @orangesoup Thanks for the var window = undefined; trick, it worked. Of course it is not a good solution, but I don't know how to fix that correctly, any idea @jelbourn @hansl ?

   @orangesoup Your import problem is just a config problem. Your tsconfig.json for ts-node must be set as :

   "target": "es2015",
   "module": "commonjs"
   

   (which is not the same config as for your webpack client build).
8. jelbourn commented on Sep 14, 2016

   

   jelbourn

   on Sep 14, 2016

   Last edited by jelbourn

   ContributorAuthor

   More actions

   See #308

   We haven't had the opportunity yet to ensure that everything works with Universal, but it will be coming within the next few milestones. Happy to accept PRs to help improve this sooner, though.

   I'm actually going to close this issue now, since everything should be good for AoT AFAIK, and Angular Universal is tracked via #308.

   👍React with 👍1Reacted by shine
9. jelbourn

   closed this as completedon Sep 14, 2016
10. orangesoup commented on Sep 14, 2016

    

    orangesoup

    on Sep 14, 2016

    More actions

    @cyrilletuzi You mean I have to manually build material with that tsconfig?
11. cyrilletuzi commented on Sep 14, 2016

    

    cyrilletuzi

    on Sep 14, 2016

    Contributor

    More actions

    @orangesoup no you don't need to build on server side, but as Angular 2 is in TypeScript, which is not understood by node natively, you need to use ts-node with that config.
12. dotansimha commented on Sep 15, 2016

    

    dotansimha

    on Sep 15, 2016

    Last edited by dotansimha

    More actions

    Any solution so far?
    I am using Universal and unable to import the material modules.
    Always the same error - "window is no defined". using alpha8-1.
    Older versions worked just fine :(

    👍React with 👍1Reacted by Francesco
13. cyrilletuzi commented on Sep 17, 2016

    

    cyrilletuzi

    on Sep 17, 2016

    Contributor

    More actions

    @dotansimha @orangesoup See a temporary workaround here in #308
14. angular-automatic-lock-bot commented on Sep 5, 2019

    

    angular-automatic-lock-botbot

    on Sep 5, 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.}
15. angular-automatic-lock-bot

    unassigned

    hansl

    on Sep 5, 2019
16. angular-automatic-lock-bot

    locked and limited conversation to collaborators on Sep 5, 2019