์ด ์ ์ฅ์๋ ๊ณ ํ์ง์ ํ์ ์คํฌ๋ฆฝํธ(TypeScript) ์๋ฃํ ์ ์(Type definition)๋ฅผ ์ํ ์ ์ฅ์์ ๋๋ค.
์ด ๋์๋ง์ ์์ด, ์คํ์ธ์ด, ๋ฌ์์์ด, ๊ทธ๋ฆฌ๊ณ ์ค๊ตญ์ด๋ก๋ ์ฝ์ผ์ค ์ ์์ต๋๋ค!
๊ด๋ฆฌ์ ์ค๋ช ์ ๋งํฌ
์ ์ฅ์ ๋ฐ ํผ๋ธ๋ฆฌ์ฑ ๊ณผ์ ์ ์ํ๋ฅผ ํ์ํฉ๋๋ค. ๊ธฐ์ฌ์๋ถ๋ค์ด ์์ฑํ PR ๋๋ ํจํค์ง์ ๋ฌธ์ ๊ฐ ๋ฐ์ํ์ ๊ฒฝ์ฐ ์ด ํ์๋ฅผ ๋ณด๋ฉด ๋์์ด ๋ ์ ์์ต๋๋ค.
- ์ต์ ๋น๋๊ฐ ํ์ ์ฒดํฌ/๋ฆฐํธ ๊ณผ์ ์ ๊น๋ํ๊ฒ ํต๊ณผํ์ต๋๋ค:
- ๋ชจ๋ ํจํค์ง๊ฐ typescript@next์์์ ํ์ ์ฒดํฌ/๋ฆฐํธ ๊ณผ์ ์ ๊น๋ํ๊ฒ ํต๊ณผํฉ๋๋ค:
- ๋ชจ๋ ํจํค์ง๊ฐ 1์๊ฐ ๋ด์ npm์ ๋ฐฐํฌ๋์์ต๋๋ค:
- typescript-bot์ด Definitely Typed์์ ์ ๋๊ณ ์์ต๋๋ค
์ํ ํ์๊ฐ ๋น์ ์์ด๊ฑฐ๋ ๊ณ ์ฅ ํ์๊ฐ ๋ฐ์ํ๋ฉด Definitely Typed Gitter ์ฑ๋์์ ์ด ๋ฌธ์ ๋ฅผ ์๋ ค์ฃผ์ธ์.
ํ์ ์คํฌ๋ฆฝํธ ์๋ด์(TypeScript handbook)๋ฅผ ์ฝ์ด๋ณด์ธ์.
์ด ๋ฐฉ๋ฒ์ ์ฌ์ฉํ๊ธฐ๋ฅผ ์ถ์ฒํฉ๋๋ค. ์๋๋ ์์์ ๋๋ค:
npm install --save-dev @types/node
node
๋ฅผ ์ํ ์๋ฃํ(Typing)์ด ์ปดํ์ผ ๊ณผ์ ์ ์๋์ผ๋ก ํฌํจ๋ ๊ฒ๋๋ค.
๋ชจ๋์ ์ฌ์ฉํ์ง ์๋ ๊ฒฝ์ฐ types
์ฐธ์กฐ๋ฅผ ์ถ๊ฐํด ์ฃผ์ด์ผ ํ ์ ์์ต๋๋ค.
/// <reference types="node" />
๋ ์์ธํ ๋ด์ฉ์ ์๋ด์(Handbook)์์ ํ์ธํด๋ณด์ค ์ ์์ต๋๋ค.
NPM ์ "foo" ํจํค์ง์ ๋์๋๋ ์๋ฃํ ํจํค์ง๋ "@types/foo" ์ ๋๋ค. ์ํ์๋ ํจํค์ง๋ฅผ ์ฐพ์ ์ ์๋ ๊ฒฝ์ฐ, ํ์ ์์น(TypeSearch) ์ฌ์ดํธ์์ ํ ๋ฒ ์ฐพ์๋ณด์ธ์.
๊ทธ๋๋ ์ฐพ์ ์ ์๋ ๊ฒฝ์ฐ, ์ฐพ๊ณ ์๋ ํจํค์ง๊ฐ ์๋ฃํ(Typing)์
ํจ๊ป ์ ๊ณตํ๊ณ ์์ง๋ ์์์ง ํ์ธํด๋ณด์ธ์.
์ด ๊ฒฝ์ฐ ์ฃผ๋ก package.json
ํ์ผ์ "types"
๋ "typings"
ํ๋(Field)๋ฅผ ํตํด ์ ๊ณต๋์ง๋ง,
/// <reference path="" />
๊ฐ์ ์ฃผ์์ ์ฌ์ฉํ์ฌ ํจํค์ง ์์ ".d.ts" ํ์ผ๋ค์ ์ง์ ๊ฐ์ ธ์์ผ ํ ์๋ ์์ต๋๋ค.
Definitely Typed๋ 2๋
์ด ์ง๋์ง ์์ TypeScript ๋ฒ์ ๋ง์ ๋์์ผ๋ก ํจํค์ง๋ฅผ ํ
์คํธํฉ๋๋ค.
ํ์ฌ ๋ฒ์ 3.0 ๋ฐ ๊ทธ ์ด์๋ง์ ํ
์คํธํ๊ณ ์์ต๋๋ค.
TypeScript 2.0์์ 2.9 ๋ฒ์ ์ ์ฌ์ฉํ๋ ๊ฒฝ์ฐ, ๊ทธ๋๋ @types
ํจํค์ง๋ฅผ ํ๋ฒ ์ค์นํด ๋ณด์
๋ ๋ฌด๋ฐฉํฉ๋๋ค. ์ต์ TypeScript ๊ธฐ๋ฅ์ ์ฌ์ฉํ๋ ํจํค์ง๋ ๊ทธ๋ฆฌ ๋ง์ง ์์ผ๋๊น์.
๊ทธ๋ฌ๋ ์๋ ์ฌ๋ถ๋ฅผ ๋ณด์ฅํ์ง๋ ๋ชปํฉ๋๋ค.
์ง์ ๊ธฐ๊ฐ์ ๋ค์๊ณผ ๊ฐ์ต๋๋ค:
๋ฒ์ | ์ถ์์ผ | ์ง์ ์ข ๋ฃ |
---|---|---|
2.8 | 2018๋ 3์ | 2020๋ 3์ |
2.9 | 2018๋ 5์ | 2020๋ 5์ |
3.0 | 2018๋ 7์ | 2020๋ 7์ |
3.1 | 2018๋ 9์ | 2020๋ 9์ |
3.2 | 2018๋ 11์ | 2020๋ 11์ |
3.3 | 2019๋ 1์ | 2021๋ 1์ |
3.4 | 2019๋ 3์ | 2021๋ 3์ |
3.5 | 2019๋ 5์ | 2021๋ 5์ |
3.6 | 2019๋ 8์ | 2021๋ 8์ |
3.7 | 2019๋ 11์ | 2021๋ 11์ |
3.8 | 2020๋ 2์ | 2022๋ 2์ |
3.9 | 2020๋ 5์ | 2022๋ 5์ |
@types
ํจํค์ง ์์๋ ํจํค์ง๊ฐ ํ์คํ๊ฒ ์ง์ํ๋ TypeScript ๋ฒ์ ์ด ํ๊ทธ๋ก ์ฐ์ฌ ์์ผ๋ฏ๋ก, 2๋
์ง์ ๊ธฐ๊ฐ์ด ์ง๋ ์ค๋๋ ํจํค์ง๋ ๋ณดํต ์ฐพ์๋ณด์ค ์ ์์ต๋๋ค.
์๋ฅผ ๋ค์ด, npm dist-tags @types/react
๋ช
๋ น์ด๋ฅผ ์
๋ ฅํ๋ฉด TypeScript 2.5๋ [email protected]์ฉ ํ์
์, TypeScript 2.6 ๋ฐ 2.7์ [email protected]์ฉ ํ์
์ ์ฌ์ฉํ ์ ์๋ ๊ฒ์ ํ์ธํ์ค ์ ์์ต๋๋ค:
ํ๊ทธ | ๋ฒ์ |
---|---|
latest | 16.9.23 |
ts2.0 | 15.0.1 |
... | ... |
ts2.5 | 16.0.36 |
ts2.6 | 16.4.7 |
ts2.7 | 16.4.7 |
... | ... |
- ์ด ์ ์ฅ์์
master
๋ธ๋์น์์ ์ง์ ๋ค์ด๋ก๋ํด ํ๋ก์ ํธ์ ์ฝ์ ํ๊ธฐ Typings๋ฅผ ์ฌ์ฉํ๊ธฐ(๋ค๋ฅธ ๋ฐฉ๋ฒ์ ์ฌ์ฉํด์ฃผ์ธ์. typings๋ ๋์ด์ ์ถ์ฒํ์ง ์์ต๋๋ค)NuGet ์ ์ฌ์ฉํ๊ธฐ(๋ค๋ฅธ ๋ฐฉ๋ฒ์ ์ฌ์ฉํด์ฃผ์ธ์. NuGet์ ๋ ์ด์ DT ์๋ฃํ(Typing)์ ์ ๊ณตํ์ง ์์ต๋๋ค.)
์ ๋ฐฉ๋ฒ์ ์ฌ์ฉํ ๊ฒฝ์ฐ ์๋์ผ๋ก ์ฐธ์กฐ(Reference)๋ฅผ ์ถ๊ฐํด์ฃผ์ด์ผ ํ ์ ์์ต๋๋ค.
Definitely Typed๋ ์ฌ๋ฌ๋ถ๊ณผ ๊ฐ์ ๋ง์ ๊ธฐ์ฌ์๋ค์ ๋์ ๋๋ถ์ ๋์๊ฐ๊ณ ์์ต๋๋ค!
๊ฐ์ ํ ๋ถ๋ถ์ ์ธ์์ ๊ณต์ ํ๊ธฐ ์ ์ ๋จผ์ ์ง์ ์ฌ์ฉํด ๋ณด์ธ์.
์๋ก์ด ๊ธฐ๋ฅ์ ์ถ๊ฐํ๋ ค๋ฉด ๋ชจ๋ ์ฆ๊ฐ(module augmentation)๋ฅผ ์ฌ์ฉํ ์ ์์ต๋๋ค.
๋ฌผ๋ก node_modules/@types/foo/index.d.ts
๋ฅผ ์ง์ ์์ ํ์ค ์๋ ์์ผ๋ฉฐ, ์ด ํ์ผ์ ๋ณต์ฌํ ๋ค์ ์๋์ ๊ณผ์ ์ ๋ฐ๋ผํ์ค ์๋ ์์ต๋๋ค.
์ฌ์ฉํ๊ณ ๊ณ์ tsconfig.json
์ ๋ค์ ๋ด์ฉ์ ์ถ๊ฐํด์ฃผ์ธ์.
"baseUrl": "types",
"typeRoots": ["types"],
(types
๋์ src/types
์ ์ฌ์ฉํ์ค ์๋ ์์ต๋๋ค.)
๊ทธ๋ฆฌ๊ณ "foo" ๋ชจ๋(Module)์ ๋ํ ์ ์ธ(Declaration)์ ํฌํจํ๋ types/foo/index.d.ts
ํ์ผ์ ๋ง๋ค์ด์ฃผ์ธ์.
์ด์ ์ฝ๋ ์์์ ์ฌ๋ฌ๋ถ์ ์ ์๋ฃํ ์ ์ธ(Type declaration)์ ์ฌ์ฉํ๋ "foo"
๋ชจ๋(Module)์ ์ํฌํธ(Import)ํ์ค ์ ์์ ๊ฒ๋๋ค.
์ฝ๋๋ฅผ ์ปดํ์ผํ๊ณ ์คํ์์ผ์ ์ฌ๋ฌ๋ถ์ ์๋ฃํ(Typing)์ด ์คํ ์ค์ ์ค์ ๋ก ๋ฒ์ด์ง๋ ์ผ๊ณผ ์ ๋ง์๋จ์ด์ง๋์ง ํ์ธํด์ฃผ์ธ์.
์ค์ ์ฝ๋๋ฅผ ํตํ ํ์ธ์ด ๋๋๋ฉด, ํ ๋ฆฌํ์คํธ(Pull request)๋ฅผ ๋ง๋ค์ด์ฃผ์ธ์.
์ด๋ฏธ ์กด์ฌํ๋ ํจํค์ง๋ฅผ ์์ ํ๊ฑฐ๋ ์ ํจํค์ง๋ฅผ ๋ง๋ค๊ธฐ์ํ ๊ณผ์ ๋ค์ ๋ฐ๋ผํ์๋ฉด ๋ฉ๋๋ค.
ํจํค์ง๊ฐ ์ ์๋ํ๋์ง ํ์ธํ์ จ๋ค๋ฉด, Definitely Typed์ ๊ณต์ ํด์ฃผ์ธ์.
์ฐ์ , ์ด ์ ์ฅ์๋ฅผ ํฌํฌ(fork)ํด ์ฃผ์๊ณ , node ๋ฅผ ์ค์นํ์ ๋ค, npm install
๋ช
๋ น์ ์คํํด์ฃผ์ธ์.
cd types/my-package-to-edit
๋ช ๋ น์ ์คํํฉ๋๋ค.- ์๋ฃํ(Typing) ํ์ผ๋ค์ ์์ ํฉ๋๋ค. ํ ์คํธ๋ฅผ ์ถ๊ฐํ๋ ๊ฒ๋ ์์ง๋ง์ธ์! ๋ง์ฝ ๋ธ๋ ์ดํน ์ฒด์ธ์ง(Breaking change)๋ฅผ ๋ง๋์ จ๋ค๋ฉด, ๋ฉ์ด์ ๋ฒ์ (major version)์ ๊ผญ ์ฌ๋ ค์ฃผ์ธ์.
- ํจํค์ง ๋จธ๋ฆฟ์ฃผ์์ "Definitions by" ๋ถ๋ถ์ ์ฌ๋ฌ๋ถ์ ์ด๋ฆ์ ์ถ๊ฐํ์ค ์๋ ์์ต๋๋ค.
- ์ด๋ฆ์ ์ถ๊ฐํ์๋ฉด ๋ค๋ฅธ ์ฌ๋๋ค์ด ๊ทธ ํจํค์ง์ ๋ํ ํ ๋ฆฌํ์คํธ(Pull request)๋ ์ด์(Issue)๋ฅผ ๋ง๋ค ๋ ์ฌ๋ฌ๋ถ์๊ฒ ์๋์ด ๊ฐ๋๋ค.
// Definitions by: Alice <https://github.com/alice>, Bob <https://github.com/bob>
์ ๊ฐ์ด ์ฌ๋ฌ๋ถ์ ์ด๋ฆ์ ์ค์ ๋งจ ๋ง์ง๋ง์ ์ถ๊ฐํ ์ ์์ต๋๋ค.- ์ฌ๋์ด ๋๋ฌด ๋ง์ ๊ฒฝ์ฐ์, ๋ค์๊ณผ ๊ฐ์ด ์ฌ๋ฌ ์ค๋ก ์ฐ์ค ์๋ ์์ต๋๋ค.
// Definitions by: Alice <https://github.com/alice> // Bob <https://github.com/bob> // Steve <https://github.com/steve> // John <https://github.com/john>
tslint.json
ํ์ผ์ด ์๋ ๊ฒฝ์ฐ์๋,npm run lint package-name
๋ช ๋ น์ ์คํ์ํค๊ณ ๊ฒฐ๊ณผ๋ฅผ ํ์ธํด์ฃผ์ธ์. ๊ทธ๋ ์ง ์์ ๊ฒฝ์ฐ์๋, ํด๋น ํจํค์ง๊ฐ ์๋ ๋๋ ํ ๋ฆฌ ์์์tsc
๋ช ๋ น์ ์คํ์ํค๊ณ ๊ฒฐ๊ณผ๋ฅผ ํ์ธํด์ฃผ์ธ์.
์ด๋ฏธ ์กด์ฌํ๋ ํจํค์ง์ ๋ํ ํ ๋ฆฌํ์คํธ(Pull request)๋ฅผ ๋ง๋ค์์ ๊ฒฝ์ฐ์๋, dt-bot
์ด ์ด์ ์ ์๋ค์ ์๋์ผ๋ก ํธ์ถํ๋์ง ํ์ธํด์ฃผ์ธ์.
๊ทธ๋ ์ง ์์ ๊ฒฝ์ฐ์๋, ์ฌ๋ฌ๋ถ์ด ์ง์ ํ ๋ฆฌํ์คํธ(Pull request)์ ๊ด๊ณ์๋ ์ฌ๋๋ค์ ํธ์ถํ ์๋ ์์ต๋๋ค.
๋ง์ฝ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๋ฅผ ๋ง๋๋ ์ค์ด๊ณ ๋ผ์ด๋ธ๋ฌ๋ฆฌ๊ฐ ํ์ ์คํฌ๋ฆฝํธ(TypeScript)๋ก ์ฐ์ฌ์๋ค๋ฉด, Definitely Typed ์ ์ ์ธ(Declaration)์ ์ฌ๋ฆฌ๋ ๋์ ํจํค์ง์ ์๋์์ฑ๋ ์ ์ธ(Declaration) ํ์ผ์ ํฌํจ์ํฌ ์ ์์ต๋๋ค.
NPM ํจํค์ง๋ฅผ ์ํ ์๋ฃํ(Typing) ํจํค์ง๋ฅผ ๋ง๋์๋ ค๋ฉด, ํจํค์ง์ ์ด๋ฆ๊ณผ ๊ฐ์ ์ด๋ฆ์ ๋๋ ํ ๋ฆฌ๋ฅผ ๋ง๋ค์ด์ฃผ์ธ์.
NPM ์ ์ฌ๋ผ๊ฐ ์์ง ์์ ํจํค์ง๋ฅผ ์ํ ์๋ฃํ(Typing) ํจํค์ง๋ฅผ ๋ง๋์๋ ค๋ฉด, ๊ทธ ํจํค์ง๊ฐ NPM ์ ์ฌ๋ผ์ ์๋ ํจํค์ง์ ์ด๋ฆ์ด ๊ฒน์น์ง ์๋์ง ํ์ธํด์ฃผ์ธ์.
(npm info foo
๋ช
๋ น์ด๋ฅผ ์ฌ์ฉํ์ฌ foo
ํจํค์ง๊ฐ NPM ์ ์๋์ง ํ์ธํ ์ ์์ต๋๋ค.)
์ ์๋ฃํ ํจํค์ง๋ ๋ค์๊ณผ ๊ฐ์ ๊ตฌ์กฐ๋ก ๊ตฌ์ฑ๋์ด์์ด์ผ๋ง ํฉ๋๋ค.
ํ์ผ ์ด๋ฆ | ์ฉ๋ |
---|---|
index.d.ts | ํจํค์ง๋ฅผ ์ํ ์๋ฃํ(Typing)์ ํฌํจํ๋ ํ์ผ์ ๋๋ค. |
foo-tests.ts | ์๋ฃํ(Typing)์ ํ ์คํธ๋ฅผ ์ํ ํ์ผ์ ๋๋ค. ์ด ํ์ผ์ ์ฝ๋๋ ์คํ๋์ง๋ ์์ง๋ง, ์๋ฃํ ๊ฒ์ฌ(Type checking)๋ฅผ ํต๊ณผํด์ผ ํฉ๋๋ค. |
tsconfig.json | tsc ๋ช
๋ น์ ๋๋ฆด ์ ์๊ฒ ํด์ฃผ๋ ํ์ผ์
๋๋ค. |
tslint.json | ๋ฆฐํฐ(Linter)๋ฅผ ์ฌ์ฉํ ์ ์๊ฒ ํด์ฃผ๋ ํ์ผ์ ๋๋ค. |
์ด ํ์ผ๋ค์, npm โฅ 5.2.0 ์์๋ npx dts-gen --dt --name my-package-name --template module
๋ช
๋ น์ผ๋ก,
๊ทธ ์ดํ ๊ฒฝ์ฐ์๋ npm install -g dts-gen
์ dts-gen --dt --name my-package-name --template module
๋ช
๋ น์ผ๋ก ๋ง๋ค ์ ์์ต๋๋ค.
dts-gen
์ ๋ชจ๋ ์ต์
(Option)์ ๋ณด๊ณ ์ถ์ผ์๋ฉด dts-gen ์ ์ฅ์๋ฅผ ํ์ธํด์ฃผ์ธ์.
์๋ฃํ(Typing) ํจํค์ง์ ์ ํ์ผ์ ์ถ๊ฐํ๊ฑฐ๋, async
ํค์๋๋ฅผ ์ฌ์ฉํ๊ธฐ ์ํด "target"
์ "es6"
๋ก ์ค์ ํ๊ฑฐ๋, "lib"
๋ฅผ ์ถ๊ฐํ๊ฑฐ๋, jsx
์ง์์ ์ถ๊ฐํ๊ธฐ ์ํด์ tsconfig.json
ํ์ผ์ ๋ณ๊ฒฝํด์ผ ํ ์๋ ์์ต๋๋ค.
Definitely Typed ์ ๊ด๋ฆฌ์๋ค์ด ์ฃผ๊ธฐ์ ์ผ๋ก ์๋ก์ด ํ ๋ฆฌํ์คํธ(Pull request)๋ค์ ํ์ธํ๊ธฐ๋ ํ์ง๋ง, ๋ค๋ฅธ ํ ๋ฆฌํ์คํธ(Pull request)๊ฐ ๋ง์ ๊ฒฝ์ฐ ํ์ธ์ด ๋๋ ค์ง ์ ์๋ค๋ ๊ฑธ ์์์ฃผ์ธ์.
base64-js ํจํค์ง๋ ์ข์ ์์ ์ค ํ๋์ ๋๋ค.
- ์ฐ์ , ์๋ด์(Handbook)์ ๋์์๋ ๋ด์ฉ๋ค์ ๋ฐ๋ผ์ฃผ์ธ์.
- ์ฝ๋์์๋ ๋ชจ๋ ๊ณณ์์ ํญ(Tab)์ ์ฌ์ฉํ๊ฑฐ๋, ํญ์ 4 ๊ฐ์ ๋์ด์ฐ๊ธฐ๋ฅผ ์ฌ์ฉํด์ฃผ์ธ์.
function sum(nums: number[]): number
์ ๊ฒฝ์ฐ, ๋ง์ฝ ํจ์๊ฐ ์ธ์๋ฅผ ๋ณ๊ฒฝํ์ง ์๋๋ค๋ฉดReadonlyArray
๋ฅผ ์ฌ์ฉํด์ฃผ์ธ์.interface Foo { new(): Foo; }
์ ๊ฒฝ์ฐ, ์ด๋ฐ ์ ์ธ์ ์ด ํ(Type)์ ๊ฐ์ง ๊ฐ์ฒด(Object)์new
๋ฅผ ์ฌ์ฉํ ์ ์๋๋ก ๋ง๋ญ๋๋ค. ๋ง์ ๊ฒฝ์ฐ ์ฌ๋ฌ๋ถ์declare class Foo { constructor(); }
๋ฅผ ์ฌ์ฉํ๋ ค๋ ๊ฒ์ผ ๊ฒ๋๋ค.const Class: { new(): IClass; }
์ ๊ฒฝ์ฐ,new
๋ฅผ ์ฌ์ฉํ ์ ์๋ ์์๋ฅผ ๋ง๋๋ ๋์ ,class Class { constructor(); }
์ ๊ฐ์ด ํด๋์ค ์ ์ธ(Class declaration)์ ์ฌ์ฉํ๋ ๊ฒ ๋ ์ข์ต๋๋ค.getMeAT<T>(): T
์ ๊ฒฝ์ฐ, ๋ง์ผ ์๋ฃํ ๋งค๊ฐ๋ณ์(Type parameter)๊ฐ ํจ์์ ๋งค๊ฐ๋ณ์์ ๋ฑ์ฅํ์ง ์๋๋ค๋ฉด, ๊ทธ๋ฐ ์ ๋๋ฆญ(Generic) ํจ์๋ฅผ ์ฌ์ฉํ ํ์๊ฐ ์์ต๋๋ค. ๊ทธ ์ ๋๋ฆญ(Generic) ํจ์๋ ๋จ์ํ ์๋ฃํ ๋จ์ธ(Type assertion)์ ์์ฅ์ํจ ๊ฒ๋ฟ์ ๋๋ค. ์ด ๊ฒฝ์ฐgetMeAT() as number
์ ๊ฐ์ด ์ง์ง ์๋ฃํ ๋จ์ธ(Type assertion) ์ ์ฌ์ฉํ๋ ๊ฒ ๋ ์ข์ต๋๋ค. ๋ค์์ ๊ด์ฐฎ์ ์ ๋๋ฆญ(Generic)์ ์์์ ๋๋ค.function id<T>(value: T): T;
. ๋ค์์ ๋ฌธ์ ๊ฐ ์๋ ์ ๋๋ฆญ(Generic)์ ์์์ ๋๋ค.function parseJson<T>(json: string): T;
. ์์ธ์ ์ผ๋ก,new Map<string, number>()
์ ๊ฐ์ ๊ฒฝ์ฐ๋ ๊ด์ฐฎ์ต๋๋ค.Function
์ด๋Object
์ ๊ฐ์ ํ(Type)์ ์ฌ์ฉํ๋ ๊ฒ์ ๋๋ถ๋ถ์ ๊ฒฝ์ฐ ๋ฌธ์ ๋ฅผ ์ผ์ผํต๋๋ค. 99% ์ ๊ฒฝ์ฐ ๋ ๊ตฌ์ฒด์ ์ธ ํ(Type)์ ์ฌ์ฉํ๋๊ฒ ๊ฐ๋ฅํฉ๋๋ค. ํจ์(Function) ๋ฅผ ์ํด์๋(x: number) => number
์ ๊ฐ์, ๊ฐ์ฒด๋ฅผ ์ํด์๋{ x: number, y: number }
์ ๊ฐ์ ํ(Type)๋ค์ ์ฌ์ฉํ ์ ์์ต๋๋ค. ํ(Type)์ ๋ํ ์ ๋ณด๊ฐ ์ ํ ์์ ๊ฒฝ์ฐ์๋,Object
ํ(Type)์ด ์๋๋ผany
ํ(Type)์ ์ฌ์ฉํด์ผ ํฉ๋๋ค. ๋ง์ผ ์ด๋ค ํ(Type)์ด ๊ฐ์ฒด๋ผ๋ ์ฌ์ค๋ง ์๊ณ ์๋ ๊ฒฝ์ฐ,Object
๋{ [key: string]: any }
๊ฐ ์๋๋ผobject
๋ฅผ ์ฌ์ฉํด์ฃผ์ธ์.var foo: string | any
์ ๊ฒฝ์ฐ,any
๊ฐ ํฉ ์๋ฃํ(Union type)์ ์์์ ์ฌ์ฉ๋ ๊ฒฝ์ฐ, ๊ฒฐ๊ณผ ํ(Type)์ ์ธ์ ๋any
๊ฐ ๋ฉ๋๋ค. ๋ฐ๋ผ์ ํ(Type)์string
๋ถ๋ถ์ด ์ ์ฉํด ๋ณด์ธ๋ค ํ๋๋ผ๋, ์ฌ์ค์ ์๋ฃํ ๊ฒ์ฌ(Type checking)์ ์ธก๋ฉด์์any
์ ๋ค๋ฅธ ๊ฒ์ด ์์ต๋๋ค. ๋์ ,any
,string
, ๋string | object
์ค ํ๋๋ฅผ ํ์์ ๋ง๊ฒ ๊ณจ๋ผ์ ์ฌ์ฉํด์ฃผ์ธ์.
ํจํค์ง๊ฐ ์ค์ค๋ก์ ํ(Type)์ ํฌํจํ๊ฒ ๋๋ฉด, Definitely Typed ์ ์๋ ์๋ฃํ(Typing) ํจํค์ง๋ฅผ ์ญ์ ํ๋ ๊ฒ์ด ์ข์ต๋๋ค.
npm run not-needed -- typingsPackageName asOfVersion sourceRepoURL [libraryName]
๋ช
๋ น์ด๋ฅผ ์ฌ์ฉํ์ฌ ์๋ฃํ(Typing) ํจํค์ง๋ฅผ ์ญ์ ํ ์ ์์ต๋๋ค.
typingsPackageName
๋ ์ญ์ ํ ๋๋ ํ ๋ฆฌ์ ์ด๋ฆ์ ๋๋ค.asOfVersion
๋ ์ ์คํ (Stub) ์ฉ@types/foo
๋ฅผ ํผ๋ธ๋ฆฌ์(Publish)ํ ๋ฒ์ ์ ๋๋ค. ์ด ๋ฒ์ ์ ํ์ฌ NPM ์ ์ฌ๋ผ๊ฐ ๋ฒ์ ๋ณด๋ค ๋ ๋์ ๋ฒ์ ์ด์ด์ผ ํฉ๋๋ค.sourceRepoURL
๋ ์๋ฃํ(Typing)์ ํฌํจํ๊ฒ ๋ ์ ์ฅ์์ ์ฃผ์์ ๋๋ค.libraryName
๋ ํจํค์ง์ ์ด๋ฆ์ ์ฝ๊ธฐ ์ฝ๊ฒ ์ด ๊ฒ์ ๋๋ค. ์ฆ, "angular2" ๋์ ์ "Angular 2" ์ ๊ฐ์ด ์ฐ๋ ๊ฒ์ด ์ข์ต๋๋ค. (์๋ตํ์ ๊ฒฝ์ฐ์๋ "typingsPackageName" ์ ๊ฐ์ ๊ฒ์ผ๋ก ์ทจ๊ธ๋ฉ๋๋ค.)
Definitely Typed ์ ๋ค๋ฅธ ํจํค์ง๋ค์ด ์ญ์ ๋ ์๋ฃํ(Typing) ํจํค์ง๋ฅผ ์ฌ์ฉํ๊ณ ์์ ๊ฒฝ์ฐ, ํ(Type)์ ํฌํจํ๊ธฐ ์์ํ ์๋ ํจํค์ง๋ฅผ ์ฌ์ฉํ๋๋ก ์์ ํด์ผํฉ๋๋ค. ์ญ์ ๋ ์๋ฃํ(Typing) ํจํค์ง๋ฅผ ์ฌ์ฉํ๋ ๊ฐ Definitely Typed ํจํค์ง๋ค์ package.json
ํ์ผ์ "dependencies": { "foo": "x.y.z" }
๋ฅผ ์ถ๊ฐํด์ฃผ์๋ฉด ๋ฉ๋๋ค.
Definitely Typed ์ ํ ๋ฒ๋ ์ฌ๋ผ์จ ์ ์๋ ํจํค์ง๊ฐ ํ(Type)์ ํฌํจํ๊ฒ ๋์๋ค๋ฉด, notNeededPackages.json
ํ์ผ์ ์ถ๊ฐํ ํ์๋ ์์ต๋๋ค.
์๋ฃํ(Typing) ํจํค์ง๋ฅผ ๋ฆฐํธ(Lint)ํ๋ ค๋ฉด, ํจํค์ง ๋๋ ํ ๋ฆฌ์ { "extends": "dtslint/dt.json" }
๋ฅผ ํฌํจํ๊ณ ์๋ tslint.json
ํ์ผ์ ์ถ๊ฐํด์ฃผ์๋ฉด ๋ฉ๋๋ค. ๋ชจ๋ ์ ํจํค์ง๋ ํด๋น ํ์ผ์ ๊ฐ์ง๊ณ ์์ด์ผ ํฉ๋๋ค.
๊ณ ์ณ์ผ ํ์ง๋ง ์์ง ๊ณ ์ณ์ง์ง ์์ ๋ฆฐํธ(Lint) ๊ฒฐ๊ณผ๊ฐ ์์ ๋์๋ง tslint.json
์์ ๋ฆฐํธ ๊ท์น(Lint rule)์ ์ฌ์ฉํ์ง ์๋๋ก ์ค์ ํ ์ ์์ต๋๋ค. ์๋ฅผ ๋ค์ด,
{
"extends": "dtslint/dt.json",
"rules": {
// ์ด ํจํค์ง๋ Function ํ์ ์ฌ์ฉํ๊ณ ์์ผ๋ฉฐ, ๊ณ ์น๋ ๊ฒ ์ฝ์ง ์๋ค.
"ban-types": false
}
}
(๋ฆฐํธ ๊ท์น(Lint rule)์ด ์ ๋๋ก ์ ์ฉ๋์๋ ์๋๋ ๊ฒฝ์ฐ์๋, // tslint:disable rule-name
๋ //tslint:disable-next-line rule-name
๋ฅผ ์ฌ์ฉํ๋ ๊ฒ์ด ์ข์ต๋๋ค. ํ์๊ฐ ๋ ๋์ ๋ฐฉ์์
๋๋ค.)
์ด๋ค ํํ์(Expression)์ด ํน์ ํ ํ(Type)์ ๊ฐ์ง๋ค๊ณ ๋จ์ธ(Assert)ํ๊ณ ์ถ์ ๋์๋ $ExpectType
๋ฅผ ์ฌ์ฉํ์๋ฉด ๋ฉ๋๋ค. ์ด๋ค ํํ์(Expression)์ด ์ปดํ์ผ์ ์คํจํด์ผํ๋ ๊ฒฝ์ฐ์๋ $ExpectError
๋ฅผ ํ์๋ฉด ๋ฉ๋๋ค.
// $ExpectType void
f(1);
// $ExpectError
f("one");
dtslint ์ ์ฅ์์ README ํ์ผ์์ ๋ ์์ธํ ๋ด์ฉ์ ํ์ธํ์ค ์ ์์ต๋๋ค.
npm run lint package-name
๋ช
๋ น์ ํตํด ๋ณ๊ฒฝ์ ์ ํ
์คํธํ ์ ์์ต๋๋ค. ์ด ๋, package-name
์ ํ
์คํธํ๊ณ ์ถ์ ํจํค์ง์ ์ด๋ฆ์
๋๋ค.
์์ฑํ dts ํ์ผ์ ํ์ ์คํฌ๋ฆฝํธ ์ปดํ์ผ๋ฌ๋ก ๋๋ ค๋ณด๊ธฐ ์ํด ํ ์คํธ ์คํฌ๋ฆฝํธ ๋ด๋ถ์ ์ผ๋ก dtslint๋ฅผ ์ฌ์ฉํฉ๋๋ค.
master
๋ธ๋์น(Branch)์ ๋ด์ฉ๋ค์ด types-publisher ๋ฅผ ์ฌ์ฉํด ์๋์ผ๋ก @types
ํผ๋ธ๋ฆฌ์(Publish)๋ฉ๋๋ค.
ํ ๋ฆฌํ์คํธ(Pull request)๋ฅผ ์ ์ถํ์ต๋๋ค. ์ด๊ฒ ํฉ์ณ์ง ๋๊น์ง ์ผ๋ง๋ ๊ฑธ๋ฆฌ๋์?
์ํฉ์ ๋ฐ๋ผ ๋ค๋ฅด์ง๋ง, ๋๋ถ๋ถ์ ํ ๋ฆฌํ์คํธ(Pull request)๋ค์ ์ผ์ฃผ์ผ ์์ ํฉ์ณ์ง๋๋ค. ๋จธ๋ฆฟ์ฃผ์์ ์๋ ์ ์ ์ค ํ๋ช ์ ์ํด ์น์ธ๋ ํ ๋ฆฌํ์คํธ(Pull request)๋ ๋ณดํต ๋ ๋นจ๋ฆฌ ํฉ์ณ์ง๋๋ค. ์๋ก์ด ํจํค์ง์ ๋ํ ํ ๋ฆฌํ์คํธ(Pull request)๋ ๊ด๋ฆฌ์์ ์ธ์ธํ ์ฝ๋ ๋ฆฌ๋ทฐ๋ฅผ ํ์๋ก ํ๊ธฐ ๋๋ฌธ์ ๋ ์ค๋ ๊ฑธ๋ฆฌ๋ ๊ฒฝ์ฐ๊ฐ ๋ง์ต๋๋ค. ๊ฐ PR ๋ค์ ํฉ์ณ์ง๊ธฐ ์ ์ TypeScript or Definitely Typed ํ ๊ตฌ์ฑ์์ ์ฝ๋ ๋ฆฌ๋ทฐ๋ฅผ ๋ฐ์์ผ ํ๋ฉฐ, ์ด๋ ์ฌ๋์ด ํ๋ ์ผ์ด๊ธฐ ๋๋ฌธ์ ๋๋ ค์ง ์๋ ์์ผ๋ ์ํด๋ฅผ ๋ฐ๋๋๋ค. ํ ๋ฆฌํ์คํธ ๋ฒ๋ค์ด ๋ณด๋(New Pull Request Status Board)์์ ์ด๋ฆฐ ํ ๋ฆฌํ์คํธ์ ๋ํ ๊ด๋ฆฌ์๋ค์ ์งํ๋๋ฅผ ํ์ธํ์ค ์ ์์ต๋๋ค.
๋ด ํ ๋ฆฌํ์คํธ(Pull request)๋ ํฉ์ณ์ก์ต๋๋ค. ์ธ์ NPM ์ @types
ํจํค์ง๊ฐ ๊ฐฑ์ ๋๋์?
NPM ์ ํจํค์ง๋ค์ ์์๊ฐ ์์ ๊ฐฑ์ ๋ ๊ฒ๋๋ค. ๋ง์ฝ 24 ์๊ฐ์ด ์ง๋๋ ๊ฐฑ์ ๋์ง ์์ผ๋ฉด, ๋ฌธ์ ๋ฅผ ํ์ ํ๊ธฐ ์ํด @RyanCavanaugh ๋ @andy-ms ๋ฅผ ํ ๋ฆฌํ์คํธ(Pull request)์์ ํธ์ถํด์ฃผ์ธ์.
๋ค๋ฅธ ์๋ฃํ ์ ์(Type definition)์ ์์กดํ๋ ์๋ฃํ ์ ์(Type definition)์ ๋ง๋ค๊ณ ์์ต๋๋ค. <reference types="" />
์ ์ํฌํธ(import) ์ค ๋ฌด์์ ์ฌ์ฉํด์ผํ๋์?
์ธ๋ถ ๋ชจ๋(export
๋ฅผ ์ฌ์ฉํ๋ ๋ชจ๋)์ ์ฌ์ฉํ ๊ฒฝ์ฐ, ์ํฌํธ(import)๋ฅผ ์ฌ์ฉํด์ฃผ์ธ์.
ํ๊ฒฝ๊ณผ ๊ด๋ จ๋ ๋ชจ๋(ambient module)(declare module
๋ฅผ ์ฐ๊ฑฐ๋ ์ ์ญ ๋ณ์๋ค์ ์ ์ธํ ๋ชจ๋)์ ์ฌ์ฉํ ๊ฒฝ์ฐ, <reference types="" />
๋ฅผ ์ฌ์ฉํด์ฃผ์ธ์.
์ผ๋ฐ์ ์ผ๋ก๋ package.json
ํ์ผ์ ์ฌ์ฉํ ํ์๊ฐ ์์ต๋๋ค. ํจํค์ง๊ฐ ํผ๋ธ๋ฆฌ์(Publish)๋ ๋ ํจํค์ง๋ฅผ ์ํ package.json
ํ์ผ์ ์๋์ผ๋ก ์์ฑ๋ฉ๋๋ค.
๊ฐ๋ ๋ณด์ด๋ package.json
ํ์ผ์ ์์กดํ๋ ๊ฒ๋ค์ ํ์ํ๊ธฐ ์ํด ์ฌ์ฉ๋ฉ๋๋ค. ์์๋ฅผ ํ ๋ฒ ๋ณด์ธ์.
์์กด์ฑ์ ์ ์ธํ ๋ค๋ฅธ ํ๋(Field)๋ค, ๊ทธ๋ฌ๋๊น "description"
๊ฐ์ ๊ฒ๋ค์ ์ฌ์ฉํด์๋ ์๋ฉ๋๋ค.
์๋ @types
ํจํค์ง๋ฅผ ์ฌ์ฉํ๊ณ ์ถ์ผ์ค ๊ฒฝ์ฐ์๋ "dependencies": { "@types/foo": "x.y.z" }
์ ๊ฐ์ ๋ด์ฉ์ package.json
ํ์ผ์ ๋ฃ์ผ์
์ผ ํฉ๋๋ค.
์ด๋ค ํจํค์ง๋ค์ tslint.json
์ด ์๊ฑฐ๋, tsconfig.json
์ "noImplicitAny": true
, "noImplicitThis": true
, ๋ "strictNullChecks": true
๊ฐ ์์ด์.
๊ทธ๋ผ ๊ทธ ํจํค์ง๋ค์ด ์๋ชป๋ ๊ฒ๋๋ค. ๊ณ ์ณ์ ํ ๋ฆฌํ์คํธ(Pull request)๋ฅผ ์ ์ถํด์ฃผ์๋ฉด ๊ณ ๋ง๊ฒ ์ต๋๋ค.
์ด๋ฏธ ์์ฒญ๋ ์๋ฃํ ์ ์(Type definition)๋ค์ ์ฌ๊ธฐ์ ๋ณด์ค ์ ์์ต๋๋ค.
์น ํ์ค(Web standard)๊ณผ ๊ด๋ จ์ด ์๋ ์๋ฃํ(Typing)๋ค์ TSJS-lib-generator ์ ์ฅ์์ ๊ธฐ์ฌํด์ ๊ณ ์น์ค ์ ์์ต๋๋ค. ๊ณ ์ณ์ง ์๋ฃํ(Typing)์ lib.dom.d.ts
ํ์ผ์ ํฌํจ๋ ๊ฒ๋๋ค.
์ด๋ค ํจํค์ง๊ฐ export =
๋ฅผ ์ฐ๊ณ ์๋๋ฐ, ์ ๋ ๋ํดํธ ์ํฌํธ(Default import)๊ฐ ๋ ์ข์ต๋๋ค. export =
๋ฅผ export default
๋ก ๋ฐ๊ฟ๋ ๋๋์?
ํ์
์คํฌ๋ฆฝํธ(TypeScript) 2.7 ์ด์์ ์ฌ์ฉํ๊ณ ๊ณ์๋ฉด ํ๋ก์ ํธ ์์์ --esModuleInterop
๋ฅผ ์ฌ์ฉํด์ฃผ์ธ์.
๊ทธ ์ดํ์ ๊ฒฝ์ฐ, ๋ํดํธ ์ํฌํธ(Default import)๊ฐ ๋์ํ๋ ํ๊ฒฝ(Webpack, SystemJS, esm)์์ ์์
์ค์ด์๋ฉด --allowSyntheticDefaultImports
๋ฅผ ์ฌ์ฉํ๋ ๊ฑธ ๊ณ ๋ คํด๋ณด์ธ์.
์๋ฃํ ์ ์(Type definition)๊ฐ ๋ง๋ ๊ฒฝ์ฐ์๋ ์๋ฃํ ์ ์(Type definition)์ ์์ ํ์ง ๋ง์ธ์.
NPM ํจํค์ง์ ๊ฒฝ์ฐ, node -p 'require("foo")'
๊ฐ ์ํ๋ ๊ฐ์ด๋ผ๋ฉด export =
์ด ๋ง๊ณ , node -p 'require("foo").default'
์ด ์ํ๋ ๊ฐ์ด๋ผ๋ฉด export default
์ด ๋ง์ต๋๋ค.
์๋ฃํ ์ ์ธ(Type declaration)์์ ํ์ ์คํฌ๋ฆฝํธ(TypeScript) 3.1 ์ด์์ ๊ธฐ๋ฅ์ ์ฌ์ฉํ๊ณ ์ถ์ต๋๋ค.
์ ์(Definition) ๋จธ๋ฆฟ์ฃผ์(// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
) ๋ค์ // TypeScript Version: 3.1
๋ฅผ ์ถ๊ฐํด์ฃผ์๋ฉด ๋ฉ๋๋ค.
ํ์ ์คํฌ๋ฆฝํธ(TypeScript)์ ๊ธฐ๋ณธ์ผ๋ก ํฌํจ๋์ง ์์ DOM API ๋ฅผ ์ถ๊ฐํ๊ณ ์ถ์ด์.
TSJS-Lib-Generator ์ ์ฅ์๊ฐ ๊ด๋ จ๋์ด์์ ๊ฐ๋ฅ์ฑ์ด ์์ต๋๋ค. ํด๋น ์ ์ฅ์์ ์๋ด๋ฅผ ๋ฐ๋ผ์ฃผ์ธ์.
ํด๋น ํ์ค์ด ์์ง ์ด์์ธ ์ํ๋ผ๋ฉด, ์ด ์ ์ฅ์์ ๊ด๋ จ๋ ์ผ์
๋๋ค.
dom-
์ผ๋ก ์์ํ๋ ํจํค์ง๋ฅผ ๋ง๋์ ๋ค, "Project" ๋จธ๋ฆฟ์ฃผ์ ๋ถ๋ถ์ ํด๋น ํ์ค์ ๋งํฌ๋ฅผ ์จ ์ฃผ์ธ์.
๋ค๋ง ํ์ค์ด ์ด์์ ๋ฒ์ด๋๋ฉด Definitely Typed ์์ ์ญ์ ๋๊ณ @types
ํจํค์ง๊ฐ ์ง์์ด ์ค๋จ๋(Deprecated) ๊ฒ์ผ๋ก ํ์๋ ์๋ ์์ต๋๋ค.
์๋ ๋ฒ์ ๋ ๊ณ์ํด์ ์์ ํ ์์ ์ด๋ผ๋ฉด, ์ด์ ๋ฒ์ ์ ํด๋นํ๋ ์ ๋๋ ํ ๋ฆฌ(์๋ฅผ ๋ค์ด 2.
๋ฒ์ ์ ์ํด์๋ v2
)๋ฅผ ๋ง๋ค๊ณ ํ์ฌ ํ์ผ๋ค์ ๊ทธ ๋๋ ํ ๋ฆฌ๋ก ์ฎ๊ฒจ์ผ ํฉ๋๋ค. ์ ๋๋ ํ ๋ฆฌ๋ก ์ฎ๊ธด ๋ค์๋
tsconfig.json
์tslint.json
์ ํฌํจ๋ ์๋๊ฒฝ๋ก๋ค์ ์์ ํด์ฃผ์ด์ผ ํฉ๋๋ค.- ๊ฒฝ๋ก ๋์ ๊ท์น(Path mapping rule)์ ์ถ๊ฐํ์ฌ ํ ์คํธ๊ฐ ์ฌ๋ฐ๋ฅธ ๋ฒ์ ์ ๊ฒ์ฌํ๋๋ก ํด์ผํฉ๋๋ค.
์๋ฅผ ๋ค์ด, history ํจํค์ง์ 2 ๋ฒ์ ์ tsconfig.json
ํ์ผ์ ๋ค์๊ณผ ๊ฐ์ด ์๊ฒผ์ต๋๋ค.
{
"compilerOptions": {
"baseUrl": "../../",
"typeRoots": ["../../"],
"paths": {
"history": [ "history/v2" ]
},
},
"files": [
"index.d.ts",
"history-tests.ts"
]
}
์์ ์ค์ธ ํจํค์ง์ ์์กดํ๋ Definitely Typed ์ ๋ค๋ฅธ ํจํค์ง๋ค์ด ์ ๋ฒ์ ๊ณผ ํธํ๋์ง ์์ ๊ฒฝ์ฐ, ๊ทธ ํจํค์ง๋ค์๋ ์๋ ๋ฒ์ ์ผ๋ก์ ๊ฒฝ๋ก ๋์ ๊ท์น(Path mapping rule)์ ์ถ๊ฐํด์ฃผ์ด์ผ ํฉ๋๋ค. ์์ ์ค์ธ ํจํค์ง์ ์์กดํ๋ ํจํค์ง์ ์์กดํ๋ ํจํค์ง๋ค์๋ ๋๊ฐ์ ์์ ์ ํด ์ฃผ์ ์ผ ํฉ๋๋ค.
์๋ฅผ ๋ค์ด, react-router
ํจํค์ง๋ history@2
ํจํค์ง์ ์์กดํ๊ณ ์๊ธฐ ๋๋ฌธ์, react-router ํจํค์ง์ tsconfig.json
ํ์ผ์ด "history": [ "history/v2" ]
์ ๊ฐ์ ๊ฒฝ๋ก ๋์ ๊ท์น(Path mapping rule)์ ๊ฐ์ง๊ณ ์๋ ๊ฑธ ๋ณผ ์ ์์ต๋๋ค.
์ด์ด์ (react-router
ํจํค์ง์ ์์กดํ๋ ํจํค์ง์ธ) react-router-bootstrap
๋ํ tsconfig.json ํ์ผ ์์ ๊ฒฝ๋ก ๋์ ๊ท์น(Path mapping rule)์ ๊ฐ์ง๊ณ ์๋ ๊ฒ์ ๋ณด์ค ์ ์์ต๋๋ค.
/// <reference types=".." />
์์๋ ๊ฒฝ๋ก ๋์ ๊ท์น(Path mapping rule)์ด ๋์ํ์ง ์๊ธฐ ๋๋ฌธ์, Definitely Typed ํจํค์ง๋ก์ ์์กดํ ๋์๋ ์ํฌํธ(import) ๋ฅผ ์ฌ์ฉํด์ผ ํฉ๋๋ค.
์ ์ญ์ ์ผ๋ก๋ ๋ชจ๋๋ก๋ ์ฌ์ฉ๋ ์ ์๋ ํจํค์ง์ ์๋ฃํ ์ ์ธ(Type declaration)์ ์ด๋ป๊ฒ ์ฐ๋์?
ํ์ ์คํฌ๋ฆฝํธ ์๋ด์(TypeScript Handbook)์ ์ ์ธ(Declaration)์ ์ฐ๋ ๋ฐฉ๋ฒ์ ๋ํ ์ ๋ฐ์ ์ธ ์ ๋ณด์ ์์๋ค์ ํฌํจํ๊ณ ์์ต๋๋ค. ์ด ๋ด์ฉ์๋ ES6 ์์ ๋ชจ๋ ๋ฌธ๋ฒ์ ์ฌ์ฉํ ์ ์๋ ์๋ฃํ ์ ์ธ(Type declaration)์ ๋ง๋๋ ๋ฐฉ๋ฒ๊ณผ ๊ฐ์ฒด๋ฅผ ์ ์ญ์์ ์ฌ์ฉํ ์ ์๋๋ก ํ๋ ๋ฐฉ๋ฒ์ด ํฌํจ๋์ด ์์ต๋๋ค. big.js ํจํค์ง์ ์๋ฃํ ์ ์ธ(Type declaration)์ด ์ค๋ก์ ๋๋ค. ์ด ํจํค์ง๋ ์น ํ์ด์ง์ ์คํฌ๋ฆฝํธ ํ๊ทธ๋ฅผ ์ฌ์ฉํด ๋ถ๋ฌ์ฌ ์ ์์ผ๋ฉฐ, ๋ํ ES6 ์์ ์ํฌํธ(Import) ๊ตฌ๋ฌธ์ ์ฌ์ฉํด์ ๋ถ๋ฌ์ฌ ์๋ ์์ต๋๋ค.
์ฌ๋ฌ๋ถ์ ํจํค์ง๊ฐ ์ํฌํธ(Import) ๊ตฌ๋ฌธ์ ์ฌ์ฉํ์ ๋์ ์ ์ญ์ ์ผ๋ก ๋ถ๋ ์ ๋๋ฅผ ํ
์คํธ ํด๋ณด๊ณ ์ถ๋ค๋ฉด, test
๋๋ ํ ๋ฆฌ๋ฅผ ์ถ๊ฐํ๊ณ YourLibraryName-global.test.ts
๊ทธ๋ฆฌ๊ณ YourLibraryName-module.test.ts
๋ผ๋ ์ด๋ฆ์ผ๋ก ํ
์คํธ ํ์ผ ๋ ๊ฐ๋ฅผ ์ถ๊ฐํด์ฃผ์ธ์. ์ ์ญ(Global) ํ
์คํธ ํ์ผ์ ์น ํ์ด์ง์์ ์ ์ญ์ ์ผ๋ก ์ฌ์ฉ๋ ๋๋ฅผ ํ
์คํธํ๋ ํ์ผ์
๋๋ค. ์ด ํ์ผ์์๋ ์ํฌํธ(Import) ๊ตฌ๋ฌธ์ ์ฌ์ฉํ์ง ์์์ผ ํฉ๋๋ค. ๋ชจ๋(Module) ํ
์คํธ ํ์ผ์ ์ํฌํธ(Import) ๊ตฌ๋ฌธ์ ์ฌ์ฉํ ๋๋ฅผ ํ
์คํธ ํ๋ ํ์ผ์
๋๋ค. ๋ง์ฝ ์ฌ๋ฌ๋ถ์ tsconfig.json
ํ์ผ์ด files
ํ๋(Field)๋ฅผ ๊ฐ์ง๊ณ ์๋ค๋ฉด, ์ด ํ๋(Field)๋ ๋ฐ๋์ ๋ ํ
์คํธ ํ์ผ์ ๋ชจ๋ ํฌํจํด์ผ ํฉ๋๋ค. ์ด ๋ฐฉ์์ ์ฌ์ฉํ๋ ์ค๋ก ๋ํ big.js ํจํค์ง์ ์๋ฃํ ์ ์ธ(Type declaration)์์ ํ์ธํด๋ณด์ค ์ ์์ต๋๋ค.
๊ฐ๊ฐ์ ํ ์คํธ ํ์ผ์ ๋ชจ๋ ์ํฉ์ ํ ์คํธํ ํ์๋ ์๋ค๋ ๊ฑธ ์์ง๋ง์ธ์. ์ ์ญ ํ ์คํธ ํ์ผ์์๋ ์ ์ญ์ ์ผ๋ก ์ฌ์ฉ๋ ๋๋ง ํ ์คํธํ๊ณ , ๋ชจ๋ ํ ์คํธ ํ์ผ์์ ๋๋จธ์ง ์ํฉ๋ค์ ๋ชจ๋ ํ ์คํธ ํ ์ ์์ผ๋ฉฐ, ๊ทธ ๋ฐ๋์ ๊ฒฝ์ฐ๋ ๊ด์ฐฎ์ต๋๋ค.
@foo/bar
ํจํค์ง์ ๊ฐ์ ์ง์ญ ํจํค์ง(Scoped package)๋ฅผ ์ํ ์๋ฃํ ํจํค์ง(Type package)๋ types/foo__bar
๋๋ ํ ๋ฆฌ์ ์ถ๊ฐํ๋ฉด ๋ฉ๋๋ค. ๋ฐ์ค ๋ฌธ์๊ฐ ๋ ๋ฒ ์๋ ๊ฒ์ ์ฃผ์ํ์ธ์.
์ง์ญ ํจํค์ง(Scoped package)๋ฅผ ์ํ ์๋ฃํ ํจํค์ง(Type package)๋ฅผ ์์ฑํ๊ธฐ ์ํด dts-gen
๋ฅผ ์ฌ์ฉํ ๊ฒฝ์ฐ์๋,
๋ค์๊ณผ ๊ฐ์ด ์์ฑ๋ tsconfig.json
์์ ์ง์ญ ํจํค์ง(Scoped package)๋ฅผ ์ํ ์ ์ ํ ๊ฒฝ๋ก ๋์ ๊ท์น(Path mapping rule)์ ์ถ๊ฐํด์ฃผ์ด์ผ ํฉ๋๋ค.
{
"paths":{
"@foo/bar": ["foo__bar"]
}
}
๊นํ์ ์ด๋ฆ์ด ๋ฐ๋ ํ์ผ์ ํ์คํ ๋ฆฌ(History)๋ฅผ ์ง์ํ์ง ์์ต๋๋ค. ๋์ git log --follow
๋ช
๋ น์ ์ฌ์ฉํ์ธ์.
ES6 ์์ ์ฌ์ฉํ๋ ์ํฌํธ(Import)๋ฅผ ์ฌ์ฉํ๊ธฐ ์ํด ๋ชจ๋์ ์ต์คํฌํธ(Export)ํ์ง ์๋ ํจํค์ง๋ค์ ๋น ์ด๋ฆ๊ณต๊ฐ์ ์ถ๊ฐํด์ผ ํ๋์?
chai-http ํจํค์ง์ ๊ฐ์ ๋ช๋ช ํจํค์ง๋ค์ ํจ์๋ฅผ ์ต์คํฌํธ(Export)ํฉ๋๋ค.
์ด๋ฐ ํจํค์ง๋ค์ import * as foo from "foo";
์ ๊ฐ์ด ์ํฌํธ(Import)ํ๋ฉด ๋ค์๊ณผ ๊ฐ์ ์ค๋ฅ๊ฐ ๋ฐ์ํฉ๋๋ค.
error TS2497: Module 'foo' resolves to a non-module entity and cannot be imported using this construct
์ด ์ค๋ฅ๋ ํจ์์ ์ด๋ฆ๊ณผ ๋๊ฐ์ ๋น ์ด๋ฆ๊ณต๊ฐ(Namespace)์ ์ ์ํด์ ์์จ ์ ์์ผ๋, ์ข์ ๋ฐฉ๋ฒ์ ์๋๋๋ค. ์คํ์ค๋ฒํ๋ก(Stack Overflow)์ ์ด ์ง๋ฌธ์ ๋ต๋ณ์ด ์ด ๋ฌธ์ ์ ๊ด๋ จ๋์ด ์์ฃผ ์ธ๊ธ๋ฉ๋๋ค.
import foo = require("foo");
๋ฅผ ์ฌ์ฉํ์ฌ ๋ชจ๋์ ์ํฌํธ(Import)ํ๊ฑฐ๋, ํ๊ฒฝ์์ ES6 ๋ชจ๋ ๋ณํ(Module interop)์ ์ง์ํ๋ค๋ฉด --allowSyntheticDefaultImports
์ ํจ๊ป import foo from "foo";
๊ฐ์ ๋ํดํธ ์ํฌํธ(Default import)๋ฅผ ์ฌ์ฉํ๋ ๊ฒ์ด ๋ ๋์ ๋ฐฉ๋ฒ์
๋๋ค.
์ด ํ๋ก์ ํธ๋ MIT license ๊ฐ ์ ์ฉ๋์ด ์์ต๋๋ค.
๊ฐ ์๋ฃํ ์ ์(Type definition) ํ์ผ๋ค์ ์ ์๊ถ์ ๊ฐ ๊ธฐ์ฌ์๋ค์๊ฒ ์์ผ๋ฉฐ, ๊ธฐ์ฌ์๋ค์ ํด๋น ์๋ฃํ ์ ์(Type definition) ํ์ผ๋ค์ ๋งจ ์์ ๋์ด๋์ด ์์ต๋๋ค.