-
Notifications
You must be signed in to change notification settings - Fork 6.8k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Support Angular Universal (with CI job to test all components) #308
Comments
To report one problem unsolved in #774 and #883, Material is not working with Universal for now because of many reference to As proposed by @orangesoup, adding I looked at Material TypeScript source files, and found very few direct reference to |
Well I've been too optimist, the But I'm quite surprise to see so many references to |
I confirm that
I suppose this is polyfills, which are incorrectly checking on I don't know how the bundling is done so I can't help, but I think it's not a big deal to correct that. It's really blocking to not be able to use Universal with Material just because of this. |
@gdi2290 Problem is server-side, so I don't use webpack, I directly launch the TypeScript code with ts-node. |
if you use ts-node directly then you have to wait for an update or just include a fake window object for now
I have the universal-starter updated to fix the material package during build |
@gdi2290 Thanks, global patching is working as a workaround for now. Now I have another issue I already met before, and I have no idea where it comes from :
|
@gdi2290 But I'm not sure this is Universal or Material related, because with no Material, my app works just fine with Universal. Issue created in Universal repo. |
For the global patch workaround, just a note for other people interested, you need to do that :
Doing |
@gdi2290 @cyrilletuzi How did you manage to get material work though? I'm getting an error like this:
It seems like there's no umd for rippe (or anything under |
@orangesoup -- I removed |
…trap (#6225) * docs(hammerjs): new import location for Universal As mentioned in #308, if hammerjs is imported in AppModule, Universal server-side rendering will fail as hammerjs is a browser specific library using window, document... So it must be imported in browser entry point src/main.ts instead. * docs(hammerjs): new import location for Universal As mentioned in #308, if hammerjs is imported in AppModule, Universal server-side rendering will fail as hammerjs is a browser specific library using window, document... So it must be imported in browser entry point src/main.ts instead.
…trap (angular#6225) * docs(hammerjs): new import location for Universal As mentioned in angular#308, if hammerjs is imported in AppModule, Universal server-side rendering will fail as hammerjs is a browser specific library using window, document... So it must be imported in browser entry point src/main.ts instead. * docs(hammerjs): new import location for Universal As mentioned in angular#308, if hammerjs is imported in AppModule, Universal server-side rendering will fail as hammerjs is a browser specific library using window, document... So it must be imported in browser entry point src/main.ts instead.
Hello all, Should MdSelect at this point work in universal? I am getting several issues with it but none with the other components.
and also
|
@maciejtreder you are right, just faced the same problem and then moved |
@cyrilletuzi such a brillant idea to add btw. just gonna let that here, if someone is facing following error:
it's probably, because like me, your are importing the css theme with
|
Importing
Any one may have a tips how to solve that? Or is it a bug? |
|
@julienR2 coolio thx, you are right that was the problem I solved the problem like @johnnysainz suggested in following post #308 Respectively:
|
Is it possible to polyfill document, so |
hi, when we'll have a full support of Universal+Material on Angular? |
The basic test for Angular Material support has been added. Please open individual issues for anything else you might encounter with using Angular material on the server. |
Hello, same problem with angular material universal The bug has existed for a long time ! No one has a good solution for it? |
@BlankHrt see this comment for a solution that works around the issue. |
Same problem than @BlankHrt , hammerjs seems to have nothing to do with this error. I didn't import it anywhere, but I have the exact same error : SyntaxError: Unexpected token import Any idea? |
Hi ! I would need some info to help you out.
Hope we can figure out what's going on ! |
@glemiere I am having the exact same issue here: import * as i0 from '@angular/core'; SyntaxError: Unexpected token import I didn't import HammerJs anywhere. |
Hey guys! I think the problem is coming from a misconfiguration of the server side rendering in my (our) setup(s), because I've been able to fix this issue by double checking the official instructions. I'm going to use this repo for my own needs, just to earn some time, it's a pretty good seed. Thanks to @JayChase for his answer on my stackoverflow post |
Hey guys. I need to render matDialog on the server side. I see that it's impossible for now because @angular/material uses the document object for the dialogs rendering. Could you please tell me will you add possibility to render dialogs on the backend? If yes please tell me do you have an idea when this changes will be released? |
We don't have plans to support overlay-based components rendering on the server at this time (dialogs, menus, etc.). For the vast majority of cases, these components are only rendered in response to user interaction |
Ok. Got it. Thanks
Отправлено с iPhone
… 25 окт. 2017 г., в 19:52, Jeremy Elbourn ***@***.***> написал(а):
We don't have plans to support overlay-based components rendering on the server at this time (dialogs, menus, etc.). For the vast majority of cases, these components are only rendered in response to user interaction
—
You are receiving this because you commented.
Reply to this email directly, view it on GitHub, or mute the thread.
|
How about the error
While I extends two Model? |
@jelbourn In reference to MatDialog, MatMenu, and render-only-on-interaction components, how are we supposed to properly handle this? I couldn't quickly find any documentation on SSR with angular material, I checked here: https://material.angular.io/guides as well as on the component itself, https://material.angular.io/components/menu/overview Additionally, in the given example, https://material.angular.io/components/menu/examples If you could give some guidance on what we're supposed to do, I'd happily write the guide and submit a PR. |
I agree with @damienwebdev |
Closing this now since everything should mostly work with SRR this this point in time. Individual bugs can be tracked via standalone issues. |
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
There's no automated verification that all material components are safe to use in node, i.e. pre-rendering with Angular Universal. See #306.
Proposal
Create a step in the CI process to pre-compile a single root component which contains an instance of each material component. Use one of the Angular Universal pre-render libraries to build: https://github.com/angular/universal/tree/master/modules
Note: I'm planning to submit a Broccoli plugin to that repo which would work well with Angular CLI.
I'm willing to help set this up.
The text was updated successfully, but these errors were encountered: