Slide 1

Slide 1 text

5ZQF4DSJQUͰͭ͘Δ /PEFKTύοέʔδ 'VLVPLBKTň5ZQF4DSJQUʼn גࣜձࣾσΟʔθϩ 8FCΞΫηγϏϦςΟΤϯδχΞ ฏඌΏ͏ͯΜ

Slide 2

Slide 2 text

©2019 Yusuke Hirao גࣜձࣾσΟʔθϩ 8FCΞΫηγϏϦςΟΤϯδχΞ ฏඌΏ͏ͯΜ 5ZQF4DSJQUͰͭ͘Δ /PEFKTύοέʔδ 'VLVPLBKTň5ZQF4DSJQUʼn

Slide 3

Slide 3 text

©2019 Yusuke Hirao ࣗݾ঺հ ฏඌ༏యʢͻΒ͓Ώ͏ͯΜʣ גࣜձࣾσΟʔθϩ 8FCΞΫηγϏϦςΟΤϯδχΞ ϑϩϯτΤϯυΤϯδχΞ #-0(IUUQTOPUFNVZVTVLFIJSBP Yusuke Hirao @cloud10designs

Slide 4

Slide 4 text

©2019 Yusuke Hirao ͜Μͳͷ࡞ͬͯ·͢ KBDPKT೔ຊޠ༻จࣈม׵ϥΠϒϥϦ NBSLVQMJOU)5.-ϦϯλʔόϦσʔλʔ

Slide 5

Slide 5 text

©2019 Yusuke Hirao ࠓ೔͸ͳ͢͜ͱ ࠷௿ݶͷϛχϚϜͳ tsconfig.json packge.json ઃఆʹ͍ͭͯ

Slide 6

Slide 6 text

©2019 Yusuke Hirao ࠓ೔͸ͳ͞ͳ͍͜ͱ ܕͷ͸ͳ͠ NPOPSFQPʹ͍ͭͯ

Slide 7

Slide 7 text

©2019 Yusuke Hirao ΞδΣϯμ ίʔυΛॻ͘લʹܾΊ͓ͯ͘͜ͱ ઃఆ Ϗϧυ͢Δ ύϒϦογϡ͢Δ

Slide 8

Slide 8 text

©2019 Yusuke Hirao ίʔυΛॻ͘લʹܾΊ͓ͯ͘͜ͱ

Slide 9

Slide 9 text

©2019 Yusuke Hirao ίʔυΛॻ͘લʹܾΊ͓ͯ͘͜ͱ ϦϙδτϦͷσΟϨΫτϦߏ੒ +BWB4DSJQUϑΝΠϧ΍ ܕఆٛϑΝΠϧʢ*.d.tsʣͳͲͷॻ͖ग़͠ઌ w OQNͰެ։͢ΔϑΝΠϧ܊ΛೖΕΔɻ w HJUͰ͸আ֎͢Δɻ w ໊લ͸libͰ΋distͰ΋ԿͰ΋͓޷ΈͰɻϞδϡʔϧʹύεࢀ রͰ͖Δύοέʔδʢ5SFF4IBLJOHͷͨΊͩͬͨΓʣʹ͍ͨ͠৔ ߹ɺσΟϨΫτϦ໊ͪΐͬͱॏཁɻʢྫKBDPKTʣ import toHiragana from "jaco/fn/toHiragana"; toHiragana("ΧλΧφΛͻΒͳ͕ʹ");

Slide 10

Slide 10 text

©2019 Yusuke Hirao ίʔυΛॻ͘લʹܾΊ͓ͯ͘͜ͱ ϦϙδτϦͷσΟϨΫτϦߏ੒ 5ZQF4DSJQUϑΝΠϧͳͲιʔείʔυஔ͖৔ w OQNͰެ։͠ͳ͍ʢͯ͠΋͍͍ʣɻ w ͜͜΋໊લ͸͓޷ΈͰɻ

Slide 11

Slide 11 text

©2019 Yusuke Hirao ίʔυΛॻ͘લʹܾΊ͓ͯ͘͜ͱ ϦϙδτϦͷσΟϨΫτϦߏ੒ ϑΥϧμ͸ผʑ͕Φεεϝ w HJUOQNͷআ֎ઃఆָ͕ɻ w ܕఆٛϑΝΠϧʢ*.d.ts.mapʣͷιʔεϚοϓΛར༻Ͱ͖Δɻ

Slide 12

Slide 12 text

©2019 Yusuke Hirao ίʔυΛॻ͘લʹܾΊ͓ͯ͘͜ͱ ॻ͖ग़͢+4ͷόʔδϣϯʢtargetʣ es5 es2017 esnext ϝϦοτ ͲΜͳ؀ڥͰ΋ಈ͘ /PEFKTWҎ্ ͳΒಈ͘ import.metaରԠ ʢ&4.ʹඞਢʣ σϝϦοτ async/await΍ for..ofͳͲ͕ ϨΨγʔίʔυม׵͞ΕΔ ϒϥ΢βͰ࢖͏৔߹͸ CBCFMͳͲ͕ඞཁʹͳΔ ී௨ʹ࢖͏ͳΒ CBCFMͳͲ͕ඞཁ

Slide 13

Slide 13 text

©2019 Yusuke Hirao ίʔυΛॻ͘લʹܾΊ͓ͯ͘͜ͱ ॻ͖ग़͢+4ͷϞδϡʔϧγεςϜʢmoduleʣ commonjs esnext ͦͷଞ ϝϦοτ ݱࡏͷඪ४ import.metaରԠ ʢ&4.ʹඞਢʣ ͠ΒΜ σϝϦοτ &4.Ͱ࢖͑ͳ͍ ී௨ʹ࢖͏ͳΒ CBCFMͳͲ͕ඞཁ Θ͔ΒΜ

Slide 14

Slide 14 text

©2019 Yusuke Hirao ઃఆ

Slide 15

Slide 15 text

©2019 Yusuke Hirao ઃఆ $ yarn init { "name": "@yusukehirao/sample", "version": "0.1.0-alpha.0", "main": "lib/index.js", "author": "Yusuke Hirao ", "license": "MIT" } ࣮ݧͷࡍ͸4DPQFEQBDLFHFʹ͠·͠ΐ͏ ઌʹܾΊͨσΟϨΫτϦ಺ͷΤϯτϦʔϑΝΠϧ import sample from "@yusukehirao/sample"; ௨ৗͷimport࣌ͷࢀরઌʹͳΔ package.json

Slide 16

Slide 16 text

©2019 Yusuke Hirao ઃఆ $ yarn add -D typescript ίϯύΠϥΛΠϯετʔϧ { "name": "@yusukehirao/sample", "version": "0.1.0-alpha.0", "main": "lib/index.js", "author": "Yusuke Hirao ", "license": "MIT", "devDependencies": { "typescript": "^3.4.5" } } package.json

Slide 17

Slide 17 text

©2019 Yusuke Hirao ઃఆ $ ./node_modules/.bin/tsc —init { "compilerOptions": { "target": "es2017", "module": "commonjs", "declaration": true, "declarationMap": true, "sourceMap": true, "outDir": "./lib", "rootDir": "./src", "strict": true, "esModuleInterop": true } } tsconfig.json ܾΊͨॻ͖ग़͠ઌͱιʔείʔυஔ͖৔ ܾΊͨ&4όʔδϣϯϞδϡʔϧγεςϜ

Slide 18

Slide 18 text

©2019 Yusuke Hirao ઃఆ $ ./node_modules/.bin/tsc —init { "compilerOptions": { "target": "es2017", "module": "commonjs", "declaration": true, "declarationMap": true, "sourceMap": true, "outDir": "./lib", "rootDir": "./src", "strict": true, "esModuleInterop": true } } tsconfig.json ܕఆٛϑΝΠϧͱιʔεϚοϓϑΝΠϧͷ ੜ੒Λ༗ޮʹ͓ͯ͘͠

Slide 19

Slide 19 text

©2019 Yusuke Hirao ઃఆ ίϯύΠϧίϚϯυΛొ࿥ tsc ίϚϯυΛొ࿥͓ͯ͘͠ { "name": "@yusukehirao/sample", "version": "0.1.0-alpha.0", "main": "lib/index.js", "author": "Yusuke Hirao ", "license": "MIT", "scripts": { "build": "tsc", "prepack": "tsc" }, "devDependencies": { "typescript": "^3.4.5" } } package.json w Φϓγϣϯ͸tsconfig.jsonʹॻ͍͓͚ͯ ͹جຊ͍Βͳ͍ɻ w prepackεΫϦϓτ͸ύοέʔδެ։࣌ͷ Ϗϧυ๨Ε๷ࢭɻ

Slide 20

Slide 20 text

©2019 Yusuke Hirao ઃఆ ܕఆٛϑΝΠϧΛొ࿥ ΤϯτϦʔϑΝΠϧͷܕఆٛϑΝΠϧͷύε { "name": "@yusukehirao/sample", "version": "0.1.0-alpha.0", "main": "lib/index.js", "types": "lib/index.d.ts", "author": "Yusuke Hirao ", "license": "MIT", "scripts": { "build": "tsc", "prepack": "tsc" }, "devDependencies": { "typescript": "^3.4.5" } } package.json w ܕ৘ใΛఏڙͰ͖Δɻ w Α͘ @types/xxxxxͰࢀর͢Δ %FpOJUFMZ5ZQFE%FpOJUFMZ5ZQFEʹ13 ૹΔඞཁͳ͍ɻ

Slide 21

Slide 21 text

©2019 Yusuke Hirao Ϗϧυ͢Δ

Slide 22

Slide 22 text

©2019 Yusuke Hirao Ϗϧυ͢Δ $ yarn build

Slide 23

Slide 23 text

©2019 Yusuke Hirao Ϗϧυ͢Δ $ yarn build

Slide 24

Slide 24 text

©2019 Yusuke Hirao ύϒϦογϡ͢Δ

Slide 25

Slide 25 text

©2019 Yusuke Hirao ύϒϦογϡ͢Δ $ touch .npmignore ύοέʔδʹؚ·ͳ͍ϑΝΠϧͷআ֎ઃఆΛ͢Δ src tsconfig.json tsconfig.tsbuildinfo .npmignore w package.jsonͷfilesʹύοέʔδʹؚΊ ͍ͨϑΝΠϧͷϗϫΠτϦετΛॻ͍ͯ΋Α ͍ɻ w .npmignore͔files͕ͳ͍ͱɺ.gitignore Λআ֎ઃఆͱΈͳ͢ͷͰɺॻ͖ग़͠ઌͷσΟϨ ΫτϦ͕ύοέʔδʹೖΒͳ͍൵ࢂͳ͜ͱʹͳ Δ

Slide 26

Slide 26 text

©2019 Yusuke Hirao ύϒϦογϡ͢Δ $ npm publish

Slide 27

Slide 27 text

©2019 Yusuke Hirao ύϒϦογϡ͢Δ ܕఆٛϑΝΠϧ΋ެ։͍ͯ͠ΔͷͰɺ 5ZQF4DSJQU͔Β͸΋ͪΖΜɺ+BWB4DSJQUͰ΋ܕΛࢀরͰ͖Δ

Slide 28

Slide 28 text

5ZQF4DSJQUͰ ར༻ͯ͠΋Β͑·͢Αʔʹ

Slide 29

Slide 29 text

גࣜձࣾσΟʔθϩ 8FCΞΫηγϏϦςΟΤϯδχΞ ฏඌΏ͏ͯΜ 5ZQF4DSJQUͰͭ͘Δ /PEFKTύοέʔδ 'VLVPLBKTň5ZQF4DSJQUʼn