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

JavaScriptのimport/export

52ecfbc87e5145ed5cd8cd81de9cffa8?s=47 Kazunori-Kimura
March 06, 2018
Technology
0
360

 JavaScriptのimport/export

JavaScriptのimport/exportについて、CommonJS ModulesとES Modulesの違いとWebPack, Parcelの紹介

52ecfbc87e5145ed5cd8cd81de9cffa8?s=128

Kazunori-Kimura

March 06, 2018
Tweet

More Decks by Kazunori-Kimura

See All by Kazunori-Kimura
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
92
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
76
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
330
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
60
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
36
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
230
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
27
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
390
52ecfbc87e5145ed5cd8cd81de9cffa8?s=48 kazunorikimura
0
63

Other Decks in Technology

See All in Technology
65d8522e6ea1d11c8f6343027b2e1688?s=48 yashi8484
0
100
7cd783377515bdf8207062840b7b2f4e?s=48 soracom
0
130
C6296f654b1cc6886aabe5b9703cbe67?s=48 ishiitetsuji
0
110
03d565e037c55da5d503eb5a21dba86b?s=48 honai
9
5.7k
3373c144fef1d3518b9b3f24a6b46ad0?s=48 lmi
5
3.3k
7e3cdbf62ad6e34cf379443678b1b378?s=48 sogaoh
2
420
F83990c21f948a63f6732144e56dafcc?s=48 michigari
0
180
Cd931bc05e7cee46b9a950a63e47ba4c?s=48 you
0
100
Fb025419ed38f98df595eb2eafc859f4?s=48 ihcomega56
2
690
7a54d6143169419fc6d4d9a0ff3056ea?s=48 maekawa123
0
460
652359244199b2b5108a5e09c027e0da?s=48 ykanazawa
0
330
Db56c5975c67fcabeb1a395b835fa250?s=48 brtriver
1
400

Featured

See All Featured
027d1ebf66cc039a0bd3b55eeadbe75d?s=48 sachag
267
17k
20bfe76b3d6105641f879fe45cfc9272?s=48 bkeepers
PRO
322
53k
Af6a12710770ad9a7cfd08c97efd40d3?s=48 pedronauck
652
110k
170b760e0147792d0140e59ec78e9893?s=48 eitanlees
115
10k
C86443373fbfe92996aa882d0d7a59f8?s=48 imathis
479
150k
D09fad3e36ae6841f54820be0e907f7a?s=48 rocio
155
11k
5f83ef806155b403c3393160ce51f955?s=48 jlugia
217
16k
E4f5d494ebdc9e7cce1aecf3ce3e8bc1?s=48 shpigford
370
42k
8ec1383b240b5ba15ffb9743fceb3c0e?s=48 philnash
10
660
3d4519fd34b76fb265fc0237f3792bd4?s=48 danielanewman
2
550
44b54d2ffcb7857004071cc6795dde11?s=48 cassininazir
347
20k
32de0bd2ba869609d26fd052a4622778?s=48 cromwellryan
104
6.3k

Transcript

  1. JavaScriptͷ
 import/export 2018-03-17 ໦ଜ ݑن

  2. ΞδΣϯμ JavaScriptͷimport/export ES Modulesͷ࣮૷ঢ়گ webpack4͕ϦϦʔε Parcelͷ঺հ 

  3. ΞδΣϯμ JavaScriptͷimport/export ES Modulesͷ࣮૷ঢ়گ webpack4͕ϦϦʔε Parcelͷ঺հ 

  4. ෳ਺ͷJavaScriptΛಡΈࠐΉ <html>
 <body>
 :
 <script src="assets/jquery.min.js"></script>
 <script src="assets/bootstrap.min.js"></script>
 <script src="app.js"></script>


    </body>
 </html> 

  5. ෳ਺ͷJavaScriptΛಡΈࠐΉ <html>
 <body>
 :
 <script src="assets/jquery.min.js"></script>
 <script src="assets/bootstrap.min.js"></script>
 <script src="app.js"></script>


    </body>
 </html>  ଞݴޠͷJNQPSU΍JODMVEFʹ ֘౰͢Δػೳ͕ͳ͔ͬͨ

  6. JavaScriptͷimport/export  $PNNPO+4.PEVMFT &4.PEVMFT FYQPSUଆ YYYKT NPEVMFFYQPSUTYYY FYQPSUEFGBVMUYYY JNQPSUଆ JOEFYKT

    DPOTUYYYSFRVJSF YYY  JNQPSUYYYGSPNYYY

  7. JavaScriptͷimport/export  $PNNPO+4.PEVMFT &4.PEVMFT FYQPSUଆ YYYKT NPEVMFFYQPSUTYYY FYQPSUEFGBVMUYYY JNQPSUଆ JOEFYKT

    DPOTUYYYSFRVJSF YYY  JNQPSUYYYGSPNYYY /PEFKT αʔόʔαΠυ+4  ͷ࢓༷

  8. JavaScriptͷimport/export  $PNNPO+4.PEVMFT &4.PEVMFT FYQPSUଆ YYYKT NPEVMFFYQPSUTYYY FYQPSUEFGBVMUYYY JNQPSUଆ JOEFYKT

    DPOTUYYYSFRVJSF YYY  JNQPSUYYYGSPNYYY &$."4DSJQUͷ࢓༷

  9. JavaScriptͷimport/export  $PNNPO+4.PEVMFT &4.PEVMFT FYQPSUଆ YYYKT NPEVMFFYQPSUTYYY FYQPSUEFGBVMUYYY JNQPSUଆ JOEFYKT

    DPOTUYYYSFRVJSF YYY  JNQPSUYYYGSPNYYY

  10. ΞδΣϯμ JavaScriptͷimport/export ES Modulesͷ࣮૷ঢ়گ webpack4͕ϦϦʔε Parcelͷ঺հ 

  11. ϒϥ΢βͷରԠঢ়گ  JNQPSU+BWB4DSJQUc.%/ IUUQTEFWFMPQFSNP[JMMBPSHKBEPDT8FC+BWB4DSJQU3FGFSFODF 4UBUFNFOUTJNQPSU

  12. Node.jsͰES Modules ֦ுࢠΛ͢΂ͯ .mjs ͱ͢Δ --experimental-modulesϑϥάΛࢦఆ  ࢖͑Δ...͕ɺWarning͕දࣔ͞ΕΔ

  13. ΞδΣϯμ JavaScriptͷimport/export ES Modulesͷ࣮૷ঢ়گ webpack4͕ϦϦʔε Parcelͷ঺հ 

  14. όϯυϧπʔϧ ෳ਺ͷJavaScriptϑΝΠϧΛ
 ͻͱͭʹ݁߹ 

  15. όϯυϧπʔϧ  πʔϧ ಛ௃ ରԠ CSPXTFSJGZ γϯϓϧ $PNNPO+4.PEVMFT XFCQBDL ଟػೳ

    $PNNPO+4.PEVMFT &4.PEVMFT $44 *NBHFT

  16. όϯυϧπʔϧ  πʔϧ ಛ௃ ରԠ CSPXTFSJGZ γϯϓϧ $PNNPO+4.PEVMFT XFCQBDL ଟػೳ

    $PNNPO+4.PEVMFT &4.PEVMFT $44 *NBHFT

  17.  WebPack4͕ 2018-2-25 ʹϦϦʔε

  18. webpack webpack4͔ΒઃఆϑΝΠϧͳ͠Ͱಈ࡞ CLIͰ࢖͏ʹ͸ webpack ͱ webpack-cli Λ࢖༻ 

  19. ΞδΣϯμ JavaScriptͷimport/export ES Modulesͷ࣮૷ঢ়گ webpack4͕ϦϦʔε Parcelͷ঺հ 

  20.  ઃఆϑΝΠϧෆཁ js,cssͳͲͷґଘؔ܎Λ ௐࠪ͠τϥϯεύΠϧɾ όϯυϧΛߦ͏ > parcel index.html

  21. ΞδΣϯμ JavaScriptͷimport/export ES Modulesͷ࣮૷ঢ়گ webpack4͕ϦϦʔε Parcelͷ঺հ