Nuxtを使っていて
地味にハマった小ネタの紹介 / NuxtMeetUp#5

Nuxtを使っていて
地味にハマった小ネタの紹介 / NuxtMeetUp#5

5d715b858124e0dd59af1a92e4397acd?s=128

Yuki Terashima

October 18, 2018
Tweet

Transcript

  1. Λ࢖͍ͬͯͯ
 地味にϋϚͬͨখωλͷ঺հ /VYU.FFU6QTQFBLFS!Z@UFNQ

  2. ࣗݾ঺հ w :VLJ5FSBTIJNBʢࣉౢ༞كʣ w "-*4Ͱಇ͍͍ͯΔ w /VYUྺ͸൒೥͘Β͍  

  3.   IUUQTBMJTNFEJBKQ

  4. IUUQTTQFBLFSEFDLDPNZ@UFNQKTFSEPUJOGPUINFNPSJBMFWFOU  

  5. /VYUΛ࢖ͬͯͯ
 ʢ஍ຯʹʣϋϚͬͨ͜ͱ

  6. ஍ຯʹϋϚΓϙΠϯτ͕͋Δ w ৽نαʔϏε։ൃͰ/VYUΛར༻։࢝ʢdʣ w ͦͷͱ͖͔ΒϋϚ͖ͬͯͨϙΠϯτ͕͍͔ͭ͋͘Δ w ࠓճ͸ͦΕΒͷղܾํ๏Λ͝঺հ͠Α͏ͱࢥ͍·͢  

  7. (5.ͷઃఆ

  8. (5.ͷઃఆ w (5.ʢ(PPHMF5BH.BOBHFSʣͷઃఆͰएׯͯͣͬͨ͜ w ("͸ઐ༻ͷϓϥάΠϯʢ@nuxtjs/google-analyticsʣΛ
 ࢖͑͹͍͍͚Ͳɺ(5.͸ͪΐͬͱ໘౗  

  9. (5.ͷઃఆ݁࿦ w IUUQTKBOVYUKTPSHGBRHPPHMFBOBMZUJDTΛࢀߟʹ ࣮૷ͨ͠ w "-*4Ͱ͸ҎԼͷϑΝΠϧͰରԠ͍ͯ͠Δ w IUUQTHJUIVCDPN"MJT1SPKFDUGSPOUFOE BQQMJDBUJPOCMPCEFWFMPQBQQQMVHJOTHUNKT w

    ΍ͬͺΓ/VYUͷQMVHJOT͸ศར  
  10. -BNCEB্Ͱಈ͔͢

  11. -BNCEB্Ͱಈ͔͢ w "-*4ͷ/VYU͸"84ͷ-BNCEB্Ͱಈ͍͍ͯΔ w ౰࣌ࣄྫ͕΄΅ͳ͘ɺͲͷΑ͏ʹ࣮૷͢Ε͹Α͍͔ࠔͬͨ  

  12. -BNCEB্Ͱಈ͔݁͢࿦ w NZBBLFOVYUPOMBNCEBΛࢀߟʹ࣮૷ͨ͠ w ͍·͸"-*4ͷ࣮૷ྫ΋ࢀߟʹͳΔ͔΋ʁ  

  13. -BNCEB্Ͱಈ͔͢஫ҙ఺ w QBDLBHF͢Δͱ͖ʹআ֎͢Δ
 ϑΝΠϧͷࢦఆ w σϓϩΠύοέʔδΛখ͘͞
 ͢ΔͨΊʹnode_modules ಺ͷෆཁͳ
 ϑΝΠϧΛআ֎͢Δඞཁ͕͋Δ w

    େ͖͍ϑΝΠϧΛ༏ઌతʹ
 আ֎͍ͯ͠Δ  
  14. Τϥʔͷڍಈ

  15. Τϥʔͷڍಈ w /VYU͸layouts/error.vue Λ௥Ճͯ͠ΤϥʔϖʔδΛ
 ΧελϚΠζͰ͖Δ w ͨͩ͠ɺ443Λ͍ͯ͠Δͱ͖͸ܥΤϥʔൃੜ࣌ʹ
 ͜ͷϑΝΠϧ͕ಡΈࠐ·Εͳ͍ w 443͍ͯ͠Δͱ͖΋ΧελϚΠζͨ͠ΤϥʔϖʔδΛ


    ද͍ࣔͨ͠ʂ  
  16. ௐ΂ͨ݁Ռ w IUUQTHJUIVCDPNOVYUOVYUKTJTTVFT
 ΛݟΔͱɺͲ͏΍Βapp/views/error.htmlͰઃఆ͢Δ
 Β͍͠  

  17. ഑ஔͯ͠Έ͕ͨʜ w ࢦఆ௨Γ഑ஔ͕ͨ͠ɺͳ͔ͥ͏·͘൓ө͞Εͳ͍ w ͳΜ͔ϛε͍ͬͯΔʁ w ͍Ζ͍Ζࢼ͕ͨ͠ɺ͏·͍͔͘ͳ͍  

  18. ΋͔ͯ͠͠ŋŋŋ w "-*4͸nuxt.config.jsͷ
 srcDir ͷઃఆΛappʹͯ͠ ͍ͨ w ͜Ε͕ݪҼ͡ΌͶʁ  

  19. ಈ͍ͨ w app/app/views/error.htmlʹ഑ஔͨ͠Βಈ͍ͨʜ w มͳϙΠϯτͰ஍ຯʹϋϚͬͯ͠·ͬͨ w /VYUͷύεઃఆ͸஍ຯʹϋϚΔ͜ͱ͕͋ΔͷͰ
 ஫ҙ͍ͨ͠  

  20. ·ͱΊ w มͳͱ͜ΖͰϋϚΔ͜ͱ΋͕͋ͬͨɺجຊతʹ/VYU͸
 ࢖͍΍͍͢ҹ৅ w /VYU͸ެࣜυΩϡϝϯτ͕ॆ࣮͍ͯ͠ΔͷͰɺ͜ΕΛ
 ಡΊ͹େ఍ͷ͜ͱ͕೺ѲͰ͖Δ w มͳͱ͜ΖͰϋϚΓͦ͏ͩͬͨΒɺ"-*4ͷ࣮૷΋
 ࢀߟʹͯ͠Έ͍ͯͩ͘͞ʂˡॏཁ

    w IUUQTHJUIVCDPN"MJT1SPKFDUGSPOUFOEBQQMJDBUJPO