Angularのライブラリ作成について /ng-kyoto-angular-meetup-8

Angularのライブラリ作成について /ng-kyoto-angular-meetup-8

ng-kyoto Angular Meetup #8 (2018/10/06) での 発表資料です。
https://ng-kyoto.connpass.com/event/100685/

Ebd60ccc96d5c538398b4c9121c64317?s=128

Sayaka Nakatsuka

October 06, 2018
Tweet

Transcript

  1. AngularͷϥΠϒϥϦ࡞੒ʹ ͍ͭͯ ng-kyoto Angular Meetup #8 @sayanaka

  2. @sayanaka • ࣾձਓ̑೥໨ʢͨͿΜʣ • JavaScript৮Γͩͯ̏͠೥໨ • લ৬ɿC#ϝΠϯͷձࣾͰͳ͔ͥ1ਓ͚ͩJSॻ͍ͯ·ͨ͠ • ࠓ݄͔Βɺ͍Ζ͍Ζ޿͘ઙ͘৮Δձࣾʹస৬ •

    GO, Angular, React… • Ϟϒϓϩָ͍͠ʢ͚ͲΊͬͪΌർΕΔʂʣ
  3. ͦ΋ͦ΋ • ۀ຿ͰAngularͷϥΠϒϥϦ࡞ͬͯͨ
 (2016೥ޙ൒ʙʣ • AngularΛ࢖ͬͨʮαΠτ/ΞϓϦʯͷ৘ใ͸͋Δ • AngularΛ࢖ͬͨʮϥΠϒϥϦʯͷ։ൃ৘ใ͸΄΅ͳ ͍

  4. ཁ๬͸͋Δ΋ɾɾɾ https://github.com/angular/angular-cli/ issues/1692

  5. ※ࡶͳ༁ : ɹٞ࿦͋Γ͕ͱ͏ʂͰ΋ॾʑͷཧ༝ͰɺCLI 1.xͰ͸࣮૷Ͱ͖ͳ͍Μͩʂ https://github.com/angular/angular-cli/issues/1692#issuecomment-304970595

  6. sayanaka͸͕͍͋ͨ • ͍ΖΜͳAngularϥΠϒϥϦͷϏϧυํ๏Λௐࠪ • angular-library-seed • ngx-translate • angular-calendar •

    ௐࠪ݁ՌΛ΋ͱʹɺ͓ख੡ webpack.config.tsΛ ࡞੒ʂ
  7. ͕͍͋ͨΜ͚ͩͲɾɾɾ • ng build͸௨ͬͯ΋ɺng build —-prod͸௨ Βͳ͍ɾɾɾ • AoTϏϧυ͕౗ͤͳ͍ɾɾɾ

  8. ͦͯ͠ߟ͑ΔͷΛ΍Ίͨ • ϓϩμΫγϣϯϏϧυ͢Δͱ͖͸ɺ
 ng build —prod —aot=falseͰ❤ • όουϊ΢ϋ΢ͳͷͰྑ͍ࢠ͸΍Ί·͠ΐ͏ •

    @angular/cli@6.2.4Ͱ͸ɺ—aotΦϓγϣϯΛ෇Ճ ͢ΔͱΤϥʔు͖·͢ɻ
  9. ͦͷ··࣌͸ܦͪ2017೥ळ • ng-packagr ര஀

  10. ng-packagr • AngularͷPackage FormatʹԊͬͯΑ͠ͳʹϏϧυͯ͠ ͘ΕΔਆϥΠϒϥϦ • v1.0.0 - 2017/08/31ϦϦʔε •

    ng-package.jsonΛ༻ҙͯ͠ɺ͋ͱ͸ී௨ͷnpmϥΠϒ ϥϦͱಉ͡Α͏ͳײ֮Ͱpackage.jsonΛॻ͍ͯɺʮng- packagrʯίϚϯυୟ͚ͩ͘ʂ΍͍͞͠ʂ
  11. ng-packagr

  12. ng-packagr • ng new ~Ͱ࡞ͬͨϓϩδΣΫτ্Ͱͳ͍ͱ͍͚ͳ͍ • ʙCLI 1.x.x • appϑΥϧμͱಉ֊૚ʹɺϥΠϒϥϦ༻ͷϑΥϧ

    μΛ࡞ͬͯͦ͜ʹίʔυల։ • ྫɿ ng-packaged
  13. ஫ҙ఺ • AoTϏϧυ͕௨Βͳ͍ঢ়ଶͩͱɺϥΠϒϥϦͱͯ͠ϏϧυͰ͖ ͳ͍ • ٯʹ͍͏ͱɺϥΠϒϥϦͱͯ͠Ϗϧυ͕௨Ε͹ɺAoT΋௨Δ • export * from

    ‘~~’ͱ͔ॻ͍ͯΔͱɺϏϧυΤϥʔΛు͘৔߹͕ ͋Δ • importจͰɺʮ~~/indexʯΛলུ͠ͳ͍ • ԣணͤͣɺ໌֬ʹexport { hoge, fuga } from ‘~~’ͱ͢Δ͜ͱ
  14. ಋೖ͢Δͷ໘౗ͦ͘͞͏ɾɾɾ

  15. Angular CLI 6 • 2018.05.04ϦϦʔε - ݱࡏ v6.2.4 • ઃఆϑΝΠϧ͕มΘͬͨ

    • ΊͬͪΌػೳ͕૿͑ͨ
  16. Library Support!

  17. Angular CLI 6 • Angular CLIͱɺng-packagr͕࿈ܞ͢ΔΑ͏ʹ ͳͬͨ • ng g

    library ~Λୟ͘ͱɺng-packagr͕མͪͯ͘ Δ • σϞ
  18. ·ͱΊ

  19. ·ͱΊ • ng-packagr͸ྑ͍ͧ • Angular CLI 6.x͔Β͸
 ΊͬͪΌ؆୯ʹϥΠϒϥϦΛ࡞ΕΔΑ͏ʹ ͳ͍ͬͯΔͷͰɺͥͻ΍ͬͯΈ͍ͯͩ͘͞ʂ

  20. ͝੩ௌ ͋Γ͕ͱ͏͍͟͝·ͨ͠ʂ