[PatternFly] patternfly-ng and SystemJs
Stan Silvert
ssilvert at redhat.com
Fri May 18 11:54:57 UTC 2018
On 5/16/2018 2:28 PM, Dan Labrecque wrote:
> Do you have an example app repo so we can see how it's failing?
I've put together a version of the Tour of Heroes demo using SystemJS
and PatternFly-NG.
https://github.com/ssilvert/angular-tour-of-heroes/tree/systemjs-patternfly-ng
You can see the changes I made in the first commit to get
EmptyStateComponent to render. I had to configure every pf-ng
dependency in my system-config.ts file.
https://github.com/ssilvert/angular-tour-of-heroes/commit/20ae37b47c7b8052da50a3a26810d6eb024d3be4
I got it to finally "work" with the following caveats:
1) You have to install a transpiler so that code can be transpiled in
the browser. This, of course, is unacceptable for production. I think
the problem is that the production version of pf-ng specifies a module
type of "es2015". See tsconfig-prod.json. In the plain tsconfig.json,
it is using commonjs, which I think would eliminate the issue. Perhaps
we need to release two versions?
2) If you reference pf-ng's root index.js, you will get an error:
"Cannot read property 'Injectable of undefined'".
To get around this error, I had to reference the index.js in each
component's subdirectory. You can see how this is set up in
system-config.ts and how the import is done in app.module.ts. I'm
concerned that this workaround may not work for all components and that
I'll just hit the above error again eventually.
3) Everything in RxJs is loading, causing dozens of small requests for
RxJs files. Again, this won't work be acceptable for production. I
fixed this problem in my own app by installing the rxjs-system-bundle
package. But I haven't been able to get this to work with the pf-ng.
>
> On 5/16/18 11:07 AM, Stan Silvert wrote:
>> Hi Dan,
>>
>> Our app is unable to use WebPack (wish we could). I've haven't been
>> able to get PatternFlyNG to work with SystemJS. Was hoping someone
>> could tell me how to set this up.
>>
>> Stan
>>
>> On 5/16/2018 10:37 AM, Dan Labrecque wrote:
>>> Hi Stan,
>>>
>>> PatternFlyNG is built with WebPack, but that doesn't mean your
>>> application must use it. Unless you're interested in tree shaking?
>>> As a stand alone library, we're not generating a single bundle.js
>>> file as done with applications, but generating multiple index.js
>>> files, so modules can be imported individually.
>>>
>>> In the application, we're using ES6 syntax to import the modules. I
>>> haven't used SystemJS, but understand it's used client-side to
>>> import modules lazily. Looking at the SystemJS syntax, I'm not sure
>>> there is an advantage over individual ES6 module imports? That is,
>>> considering PatternFlyNG is a stand alone library.
>>>
>>> FYI, Catherine Robson mentioned she's looking for a date/time to set
>>> up with your team to talk about PatternFlyNG in more detail.
>>>
>>> Dan
>>>
>>> On 5/15/18 3:39 PM, Stan Silvert wrote:
>>>> Has anyone here successfully used patternfly-ng with a SystemJs
>>>> based application?
>>>>
>>>> Is patternfly-ng only meant to be used with WebPack?
>>>>
>>>> Stan
>>>>
>>>> _______________________________________________
>>>> PatternFly mailing list
>>>> PatternFly at redhat.com
>>>> https://www.redhat.com/mailman/listinfo/patternfly
>>>
>>> _______________________________________________
>>> PatternFly mailing list
>>> PatternFly at redhat.com
>>> https://www.redhat.com/mailman/listinfo/patternfly
>>
>>
>> _______________________________________________
>> PatternFly mailing list
>> PatternFly at redhat.com
>> https://www.redhat.com/mailman/listinfo/patternfly
>
> _______________________________________________
> PatternFly mailing list
> PatternFly at redhat.com
> https://www.redhat.com/mailman/listinfo/patternfly
More information about the PatternFly
mailing list