Vueコンポーネントを複数リポで共通化するためにやったこと

1.

7VFίϯϙʔωϯτΛෳ਺Ϧϙ Ͱڞ௨Խ͢ΔͨΊʹ΍ͬͨ͜ͱ 4$065&3 *OD !SZPUBLPEBJSB

2.

ࣗݾ঺հ גࣜձࣾ4$065&3 XFCΤϯδχΞ ਓ໨ͷΤϯδχΞ μʔπ͕޷͖
ਓͰ໧ʑͱ࿅शͯ͠·͢ !SZPUBLPEBJSB

3.

4$065&3Λ஌ͬͯΔਓ

4.

$UP#ਓࡐ঺հαʔϏε స৬ر๬ͷ஌ਓ༑ਓΛ اۀʹ঺հ͠ใुΛಘΒΕΔ

5.

༗ྉ৬ۀ঺հ ਓࡐ঺հձࣾ ϔουϋϯλʔ ࠾༻اۀ ٻ৬ऀ ঺հͯ͠ใुΛಘΔʹ͸໔ڐ͕ඞཁ ʹ

6.

εΧ΢λʔ ొ࿥ऀ ࠾༻اۀ ٻ৬ऀ ݸਓ͕঺հͯ͠ใुΛड͚औΕΔ ʹ

7.

αʔϏεߏ੒ εΧ΢λʔ స৬ऀ ӡӦ ࠾༻اۀ

8.

αʔϏεߏ੒ εΧ΢λʔ స৬ऀ ӡӦ ࠾༻اۀ ࢖༻ٕज़͸౷Ұ͞Ε͍ͯΔ -BSBWFM? ? 7VFY

9.

αʔϏεߏ੒ ӡӦ ࠾༻اۀ εΧ΢λʔ స৬ऀ

10.

αʔϏεߏ੒ εΧ΢λʔ స৬ऀ ӡӦ ࠾༻اۀ

11.

αʔϏεߏ੒ εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ

12.

ࠓճ͸αʔϏε಺Ͱ࢖༻ ͞ΕΔʮٻਓථʯʹ͍ͭͯ

13.

ػೳ഑ஔ εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ ٻਓථͷ࡞੒ɾฤू ٻਓථͷӾཡ
ٻਓථͷݕࡧ ٻਓථͷӾཡ ٻਓථͷ࡞੒ɾฤू ٻਓථͷݕࡧ ٻਓථͷӾཡ

14.

ػೳ഑ஔ εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ ٻਓථͷ࡞੒ɾฤू ٻਓථͷӾཡ
ٻਓථͷݕࡧ ٻਓථͷӾཡ ٻਓථͷ࡞੒ɾฤू ٻਓථͷݕࡧ ٻਓථͷӾཡ ઌʹݴ͓ͬͯ͘ͱɺɺɺ ػೳ͸ಉ͕ͩ͡ίʔυ͸ผʑ

15.

ɹʮٻਓථͷ߲໨Λ௥Ճ͍ͨ͠ʂʯ ɹʮ0,ʂͰ΋ͪΐͬͱ࣌ؒΛ໯͏Ͷʯ

16.

ɹʮٻਓථͷ߲໨Λ௥Ճ͍ͨ͠ʂʯ ɹʮ0,ʂͰ΋ͪΐͬͱ࣌ؒΛ໯͏Ͷʯ ιʔε͕ڞ௨Խ͞Ε͍ͯͳͷͰؔ܎ ͢ΔશͯͷαʔϏεΛมߋ͠ͳ͍ͱ ͍͚ͳ͍ ຊ൪%#ʹରͯ͠ϚΠάϨʔγϣϯ΋ ࣮ߦ͠ͳ͖Ό

17.

σʔλߏ଄ KPCTςʔϒϧ JE DSFBUFE@BU UJUMF
DPOUFOU@ DPOUFOU@ DPOUFOU@ σʔλΛԣ࣋ͪͰ อଘ͍ͯ͠ΔͨΊ ΧϥϜΛ௥Ճ͢Δ ඞཁ͕͋Δ

18.

σʔλߏ଄ KPCTςʔϒϧ JE DSFBUFE@BU UJUMF
DPOUFOU@ DPOUFOU@ DPOUFOU@ DPOUFOU@ σʔλΛॎ࣋ͪͰ อଘ͍ͯ͠ΔͨΊ ΧϥϜΛ௥Ճ͢Δ ඞཁ͕͋Δ ϚΠάϨʔγϣϯ

19.

σʔλΛॎ࣋ͪʹͯ͠؅ཧը໘͔Β߲໨ ͷ௥ՃΛͰ͖ͨ΄͏͕ྑͦ͞͏ʂʂ

20.

σʔλߏ଄ *E KPC@JE LFZ WBMVF DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰
DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ *E DSFBUFE@BU UJUMF 4$065&3Λ։ൃ͢ΔΤϯδχΞͷืू KPCT KPC@EFUBJMT

21.

σʔλߏ଄ *E DSFBUFE@BU UJUMF 4$065&3Λ։ൃ͢ΔΤϯδχΞͷืू KPCT *E
KPC@JE LFZ WBMVF DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ KPC@EFUBJMT KPC@EFUBJMTLFZͷछྨΛ૿΍͢ ٻਓථͷ߲໨Λ૿΍͢ %#ߏ଄Λҙࣝ͢Δ͜ͱͳ͘มߋ͕ग़དྷΔΑ͏ʹ

22.

σʔλߏ଄ *E KPC@JE ,FZ 7BMVF DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰
DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ DPOUFOU@ ʮDPOUFOU@ʯͷ಺༰ *E DSFBUFE@BU UJUMF 4$065&3Λ։ൃ͢ΔΤϯδχΞͷืू KPCT KPC@EFUBJMT KPCTςʔϒϧͷ߲໨͸࠷খݶʹͯ͠ ٻਓථͷίϯςϯπ͸ ผͷςʔϒϧʹอଘ͢Δ

23.

͜ΕͰσʔλߏ଄͸มߋʹରԠ͠΍͘͢ ͳͬͨ ࣍͸ίʔυଆͷ͓࿩ ϑϩϯτΤϯυʹয఺Λ౰͓ͯͯ࿩͠·͢

24.

ϑϩϯτߏ੒ εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ ٻਓථ ύοέʔδ ελΠϧΨΠυ ίϯϙʔωϯτू

25.

ϑϩϯτߏ੒ εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ ٻਓථ ύοέʔδ ελΠϧΨΠυ ίϯϙʔωϯτू
ࣾ಺Ͱࣗ࡞͍ͯ͠Δ 7VFίϯϙʔωϯτू

27.

Α͘࢖ΘΕΔίϯϙʔωϯτΛ ࣄલʹ༻ҙ͓͖ͯ͠ɺ TUPSZCPPLͰ֬ೝग़དྷΔΑ͏ʹ͍ͯ͠Δ

28.

TUPSZCPPLͱ͸

29.

TUPSZCPPLͱ͸ ίϯϙʔωϯτ୯ҐͰ࣮ߦ͢Δ͜ͱͷ Ͱ͖ΔαϯυϘοΫε؀ڥ ͲΜͳίϯϙʔωϯτ͕ϓϩδΣΫτʹ ଘࡏ͍ͯ͠Δͷ͔Λ֬ೝ͢Δ͜ͱ͕Ͱ͖Δ

31.

ϑϩϯτߏ੒ ελΠϧΨΠυ ίϯϙʔωϯτू εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ ٻਓථ ύοέʔδ
֤ϓϩδΣΫτͰ ZBSOBEE

32.

ٻਓථύοέʔδͷ४උ 7VFϓϩδΣΫτΛ༻ҙ͢Δ AWVFDMJAͰ࡞੒͍ͯ͠Βͳ͍΋ͷΛফ͢ͷ͕͓͢͢Ί TUPSZCPPLͷಋೖ TUPSZCPPLͰ։ൃ͢Δ͜ͱʹΑͬͯΞϓϦέʔγϣϯଆͰ
ஞҰڍಈΛ֬ೝ͠ͳͯ͘΋ྑ͍ͨΊ։ൃޮ཰61 ޙʑଞͷΤϯδχΞ͕ίϯϙʔωϯτΛར༻͢Δͱ͖ͷͨ Ίʹίϯϙʔωϯτͷ࢓༷Λ࢒͢͜ͱ͕Ͱ͖Δ

33.

QBDLBHFKTPO ࠷ॳʹݺ͹ΕΔ εΫϦϓτΛࢦఆ

34.

JOEFYKT ίϯϙʔωϯτΛ ొ࿥͢Δ

35.

ΞϓϦέʔγϣϯଆ ٻਓύοέʔδΛ ZBSOBEE

36.

ΞϓϦέʔγϣϯଆ ٻਓύοέʔδΛ Πϯϙʔτ Πϯϙʔτͨ͠ ίϯϙʔωϯτΛొ࿥

37.

ΞϓϦέʔγϣϯଆ ίϯϙʔωϯτΛ ݺͼग़͢

38.

ϑϩϯτߏ੒ ελΠϧΨΠυ ίϯϙʔωϯτू εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ ٻਓථ ύοέʔδ

39.

εΧ΢λʔ స৬ऀ ࠾༻اۀ ӡӦ ٻਓථ ύοέʔδ ϑϩϯτߏ੒ ελΠϧΨΠυ ίϯϙʔωϯτू
ϓϩδΣΫτຖʹҧ͏஋Λઃఆ͍ͨ͠

40.

ΞϓϦέʔγϣϯଆ ୈҾ਺ʹΦϒδΣΫτΛ ೖΕͯઃఆ஋Λྲྀ͢

41.

ύοέʔδJOEFYKT ୈҾ਺ʹΞϓϦέʔγϣϯଆͰ ઃఆͨ͠஋͕ೖͬͯ͘Δ

42.

·ͱΊ 7VFϓϩδΣΫτͰTUPSZCPPLΛ࢖͏͜ͱͰίϯϙʔωϯτ ୯ҐͰͷ։ൃ͕͍ͩͿޮ཰తʹͳΔ ઃఆϑΝΠϧͳͲΛ༻ҙͯ͠΍ΔͱΞϓϦέʔγϣϯಛ༗ͷ ઃఆΛಡΈࠐΉ͜ͱ͕ग़དྷΔ ͜ΕͰมߋ͕͋ͬͯ΋جຊతʹ͸͜ͷύοέʔδͷΈΛมߋ
͢Ε͹ྑ͍

43.

͍͞͝ʹ 7VFKTΛ࢖ͬͯ։ൃΛ͍ͨ͠ ϑϩϯτΤϯδχΞΛืू͍ͯ͠·͢ʂ

Vueコンポーネントを複数リポ で共通化するためにやったこと

Vueコンポーネントを複数リポ で共通化するためにやったこと

Want more?

Transcript

Vueコンポーネントを複数リポで共通化するためにやったこと

Vueコンポーネントを複数リポで共通化するためにやったこと