Upgrade to Pro — share decks privately, control downloads, hide ads and more …

現代フロントエンドに欠かせないwebpackとBabelを理解しよう

sakito
August 30, 2019

 現代フロントエンドに欠かせないwebpackとBabelを理解しよう

builderscon tokyo 2019の登壇資料
https://builderscon.io/tokyo/2019

Twitter
https://twitter.com/__sakito__

sakito

August 30, 2019
Tweet

More Decks by sakito

Other Decks in Technology

Transcript

  1. &$."4DSJQUʹ͓͚Δஈ֊ͷ4UBHF w 4UBHF4USBXQFSTPO
 ΞΠσΟΞஈ֊ w 4UBHF1SPQPTBM
 ࢓༷ͷχʔζɺ࢖༻ྫɺݒ೦఺ɺ໨తΛղઆ͢Δஈ֊ w 4UBHF%SBGU
 ߏจɺηϚϯςΟοΫɺ"1*͕༻ҙͰ͖͕ͨɺ


    มߋͷՄೳੑ͕͋Δஈ֊ w 4UBHF$BOEJEBUF
 &$."4DSJQUFEJUPST͔Βͷঝೝ͕ԼΓɺ
 ֎෦͔ΒͷϑΟʔυόοΫΛ΋Β͏ஈ֊ w 4UBHF'JOJTIFE
 UFTUͷςετ͕׬ྃ͠ɺͭҎ্ͷϒϥ΢βͰ
 ࣮૷͞Εɺ&$."4DSJQUFEJUPST͔Β࢓༷ςΩετͷঝೝ͕ԼΓͨஈ֊ w 5$ͷঝೝΛ௨Γɺਖ਼ࣜʹ&$."4DSJQUͷ࢓༷ʹ௥Ճ
  2. &$."4DSJQUʹ͓͚Δஈ֊ͷ4UBHF w 4UBHF4USBXQFSTPO
 ΞΠσΟΞஈ֊ w 4UBHF1SPQPTBM
 ࢓༷ͷχʔζɺ࢖༻ྫɺݒ೦఺ɺ໨తΛղઆ͢Δஈ֊ w 4UBHF%SBGU
 ߏจɺηϚϯςΟοΫɺ"1*͕༻ҙͰ͖͕ͨɺ


    มߋͷՄೳੑ͕͋Δஈ֊ w 4UBHF$BOEJEBUF
 &$."4DSJQUFEJUPST͔Βͷঝೝ͕ԼΓɺ
 ֎෦͔ΒͷϑΟʔυόοΫΛ΋Β͏ஈ֊ w 4UBHF'JOJTIFE
 UFTUͷςετ͕׬ྃ͠ɺͭҎ্ͷϒϥ΢βͰ
 ࣮૷͞Εɺ&$."4DSJQUFEJUPST͔Β࢓༷ςΩετͷঝೝ͕ԼΓͨஈ֊ w 5$ͷঝೝΛ௨Γɺਖ਼ࣜʹ&$."4DSJQUͷ࢓༷ʹ௥Ճ
  3. +BWB4DSJQU&OHJOF w ৽͍͠+BWB4DSJQUͷػೳΛϒϥ΢βͰ࢖༻Ͱ͖Δ͔͸
 +BWB4DSJQU&OHJOF࣍ୈ w ϒϥ΢βʹΑͬͯ+BWB4DSJQU&OHJOF͸ҧ͏ w $ISPNF7 w 'JSFGPY4QJEFS.POLFZ

    w 4BGBSJ+BWB4DSJQU$PSF w &HFɺ*&$IBLSB w &EHF͸ݱࡏ7ʹมߋ͞ΕΔ༧ఆ w ϒϥ΢βόʔδϣϯʹΑͬͯ࢖༻Ͱ͖Δػೳʹ͕ࠩ
 ى͖Δ
  4. 1BSTJOH ߦΘΕͨॲཧ JOEFYKT "45 5SBOTGPSNBUJPO "45 $PEF(FOFSBU MJCJOEFYKT !CBCFMDMJ !CBCFMDPSF

    !CBCFMQBSTFS !CBCFMHFOFSBUPS 1BSTJOH !CBCFMQMVHJOUSBOTGPSNBSSPXGVODUJPOT
  5. $PODFQUT w &OUSZ
 ى఺ͱͳΔϑΝΠϧΛࢦఆ w 0VUQVU
 ॲཧ͕׬ྃͨ͠ϑΝΠϧΛग़ྗ͢Δ w -PBEFST
 ࢦఆϑΝΠϧʹ೚ҙͷॲཧΛՃ͑ΔɺͭͷλεΫ

    w 1MVHJOT
 XFCQBDLͷ༷ʑͳΠϕϯτΛIPPL͠ɺσʔλΛૢ࡞ͨ͠Γ
 ॲཧΛ࣮ߦͰ͖Δ w .PEF
 OPOF EFWFMPQNFOU QSPEVDUJPOΛࢦఆ͠ɺ
 NPEFʹԠͯ͡ɺύϑΥʔϚϯε࠷దԽ΍ѹॖͳͲΛߦ͏ w #SPXTFS$PNQBUJCJMJUZ
 ϒϥ΢βͷޙํޓ׵ੑ