TypeScript ๋ฒ์ :
๋ฒ์ 2.6.2
๊ฒ์์ด:
๋ชจ๋ ๋ด๋ณด๋ด๊ธฐ ๊ธฐ๋ฅ, ์ธ๋ถ ๋ชจ๋, npm ํจํค์ง, ํ์ฌ ๋ชจ๋์ ๋ํ ์ ์ธ ํ์ผ
์ํธ
src/testFile.ts
:
import getFieldList = require('graphql-list-fields');
src/@types/graphql-list-fields/index.d.ts
:
// Doing just this below (as suggested by the Typescript Handbook does not work
// and results in the tsc error under **Actual behavior** below
import { GraphQLResolveInfo } from 'graphql';
declare function getFieldList(info: GraphQLResolveInfo): string[];
export = getFieldList;
// The code below is what actually works instead of the above
/*
declare module 'graphql-list-fields' {
import { GraphQLResolveInfo } from 'graphql';
function getFieldList(info: GraphQLResolveInfo): string[];
export = getFieldList;
}
*/
์์๋๋ ๋์ :
์ค๋ฅ์์ด ์ปดํ์ผ.
์ค์ ํ๋ :
tsc
์คํ ์ค ์ค๋ฅ :
src/testFile.ts(1,31): error TS7016: Could not find a declaration file for module 'graphql-list-fields'. '/node_modules/graphql-list-fields/index.js' implicitly has an 'any' type.
Try `npm install @types/graphql-list-fields` if it exists or add a new declaration (.d.ts) file containing `declare module 'graphql-list-fields';`
graphql-list-fields
์ ํ์ฌ ๊ฒ์ ๋ ํ์ ์ ์ธ์ด์๋ ์ฌ์ฉํ๋ ค๋ NPM ํจํค์ง์
๋๋ค.
Typescript Handbook์ ์ ์ธ ํ์ผ ์น์
์ ์ฝ์ ํ, ๋ชจ๋ ์ ๋ผ์ด๋ธ๋ฌ๋ฆฌ์ ๋ํ ์ ์ธ ํ์ผ์ ์์ฑํ๋ ค๊ณ ํ๋๋ฐ module-function.d.ts ์ ์ธ ํ์ผ ํ
ํ๋ฆฟ์ ์ฌ์ฉํด์ผํ๋ค๋ ๊ฒ์ ์์์ต๋๋ค. ์ด๊ฒ์ด ๋ด๊ฐ ์์ index.d.ts
์์ ์ฝ๋๋ฅผ ์๊ฐ ํด๋ธ ๋ฐฉ๋ฒ์ด์ง๋ง ์ปดํ์ผ๋ฌ๋ ์ฌ์ ํ 'graphql-list-fields'๋ชจ๋์ ๋ํ ์ ์ธ ํ์ผ์ด ์๋ค๊ณ ๋ถํํฉ๋๋ค. ์ํ ์ฐฉ์ค ๋์ ์ฐ๋ฆฌ๋ ๋ชจ๋ ๊ฒ์ declare module 'graphql-list-fields'
๋ฅผ ์ถ๊ฐํ๋ ๊ฒ์ด ์ปดํ์ผ๋ฌ ์ค๋ฅ์์ด ์๋ํ๋ค๋ ๊ฒ์ ๋ฐ๊ฒฌํ์ต๋๋ค.
tsconfig ๋ฌธ์์ ์ธ๊ธ ๋๋๋ก tsconfig.json
"typeRoots": ["./node_modules/@types", "./src/@types"]
์์ declare module 'graphql-list-fields'
์์ด๋ ์ฌ์ ํ ์๋ํ์ง ์์์ต๋๋ค. ์ด๊ฒ์ tsc๊ฐ typeRoots์ ์ง์ ๋ ๋๋ ํ ๋ฆฌ์์ ์ ํ ์ ์ธ์ ์ฐพ์ง ๋ชปํ๊ธฐ ๋๋ฌธ์ ๋ฌธ์ ๊ฐ๋๋ ๊ฒ ๊ฐ์ต๋๋ค.
"typeRoots"
๋ ์ ์ญ ์ฝ๋๋ฅผ ์๋ฏธํฉ๋๋ค. ์ฆ, ์ ์ญ ๋ค์ ์คํ์ด์ค์ ์ ์ธ๋์ด ์๊ณ ์ด๋ฅผ ํฌํจํ๊ณ ์ถ์ต๋๋ค. ์ด๊ฒ์ด declare module 'graphql-list-fields' {..
์๋ํ๋ ์ด์ ์
๋๋ค. ์ ์ญ ๋ค์ ์คํ์ด์ค์์ ํด๋น ์ด๋ฆ์ ๋ชจ๋์ ์ ์ธํ๊ธฐ ๋๋ฌธ์
๋๋ค.
๋ชจ๋์ ๊ฒฝ์ฐ์๋ ์์ฒด ๋ฒ์๊ฐ ์์ผ๋ฉฐ ๊ฒฝ๋ก ๋งตํผ ๊ทธ๋ง ์์ผ๋ฉด๋ฉ๋๋ค.
๊ฐ์ somethign :
{
"compilerOptions": {
"target": "es5",
"baseUrl": "./",
"paths": {
"*" : ["src/@t`ypes/*"]
}
}
}`
@mhegazy๋ฅผ ์ ๋ฆฌํด ์ฃผ์ ์ ๊ฐ์ฌํฉ๋๋ค. TypeScript ๋ฌธ์, ์๋ง๋ ์ ์ธ ํ์ผ ์น์ ์๋์ ๋ ์์ธํ ์ค๋ช ๋์ด ์๋ค๋ฉด ๋์์ด ๋ ๊ฒ์ด๋ผ๊ณ ์๊ฐํฉ๋๋ค.
TypeRoots๋ ์ค์ ๋ก ํ์ดํ ๊ณผ์ ์ญ ํธํ ๋ฐ ๋ง์ด๊ทธ๋ ์ด์ ์ ์ํด ์ถ๊ฐ ํ ์ง์์ด๋ฏ๋ก ํผ๋์ ํผํ๊ธฐ ์ํด ๊ฐ๋ฅํ ํ ๋ฌธ์์์ ์ ์ธํ๋ ค๊ณ ํ์ต๋๋ค.
์ด๊ฒ์ด ์ ์ธ ํ์ผ ์น์ ์ ๋ง๋์ง ํ์คํ์ง ์์ต๋๋ค. https://www.typescriptlang.org/docs/handbook/module-resolution.html#path -mapping์ ์ด์ ๋ํ ๋ฉ๋ชจ๊ฐ ์์ต๋๋ค.
๋ชจ๋ ํด๊ฒฐ ์น์ ์ ์ฒด์ ๋ํ ์ ์ธ ํ์ผ ์น์ ์ ๋ฉ๋ชจ๋ฅผ ์ถ๊ฐ ํ ์ ์์ต๋๋ค.
ํด๋น ์น์ ์ ์ฝ๊ณ ์ฌ์ ํ ๋ถ์กฑํ ๋ฌธ์๋ฅผ ์ฐพ์ผ๋ฉด ์๋ ค์ฃผ์ญ์์ค.
์ ๊ทธ๋ ๊ตฐ์. ๋ค, ์์ํด์ผ ํ ํ์ด์ง์ ๋๋ค. ์ ์ด๋ ๊ฒฝ๋ก ๋งคํ์ ๋ํ ๊ฐ๋ตํ ์ธ๊ธ๊ณผ https://www.typescriptlang.org/docs/handbook/declaration-files/introduction.html ์๋์ ํด๋น ๋ฌธ์์ ๋ํ ๋งํฌ๊ฐ ์์ผ๋ฉด ์ข์ ๊ฒ ๊ฐ์ต๋๋ค
์ ๋ฆฌ๋ฅผ ์ํด์ด ๋ฌธ์ ๋ฅผ ์๋์ผ๋ก ๋ซ์ต๋๋ค. ๋ฌธ์ ๋ ์ด๋ธ์ ํ์ฌ ์กฐ์น๊ฐ ๋ถ๊ฐ๋ฅํ๊ฑฐ๋ ์ด๋ฏธ ํด๊ฒฐ๋์์์ ๋ํ๋ ๋๋ค.
๋ด ์ด์ ์๊ฒฌ @ typescript-bot์ ๋ช ์๋๋๋ก ๋ฌธ์๋ฅผ ์ ๋ฐ์ดํธํ๋ ๊ฒ์ด ์ฌ์ ํ ๋์์ด ๋ ๊ฒ์ด๋ผ๊ณ ์๊ฐํฉ๋๋ค.
TypeRoots๋ ์ค์ ๋ก ํ์ดํ ๊ณผ์ ์ญ ํธํ ๋ฐ ๋ง์ด๊ทธ๋ ์ด์ ์ ์ํด ์ถ๊ฐ ํ ์ง์์ด๋ฏ๋ก ํผ๋์ ํผํ๊ธฐ ์ํด ๊ฐ๋ฅํ ํ ๋ฌธ์์์ ์ ์ธํ๋ ค๊ณ ํ์ต๋๋ค.
@mhegazy ๋ฌธ์๊ฐ ๊ฑฐ์ ๋๋ ์ ํ์๋ ์ง์ ๊ธฐ๋ฅ์ด ์๋ค๋ ๊ฒ์ ํผ๋์ ์ผ๊ธฐํฉ๋๋ค. ์ด์ ๊ฐ์ ๊ธฐ๋ฅ์ ์ ์ ํ๊ฒ ๋ฌธ์ํํ๋ ๊ฒฝ๊ณ ์ธ์ด๋ก ์์ ๋กญ๊ฒ ์์ฑ ํ์ญ์์ค. ์๋ฅผ ๋ค๋ฉด :
_ ์ฐธ๊ณ : ์ด ๊ธฐ๋ฅ์ ๋ง์ด๊ทธ๋ ์ด์ ์ ์ง์ํ๊ธฐ ์ํด ์ ๋ ฅ๊ณผ์ ํ์ ํธํ์ฑ์ ์ํด ์ ๊ณต๋ฉ๋๋ค. ์์ธํ ๋ด์ฉ์ [์ฌ๊ธฐ] ๋ฆด๋ฆฌ์ค ๋ ธํธ๋ฅผ ์ฐธ์กฐํ์ญ์์ค ._
์ด๊ฒ์ ์ ๋ณด๋ฅผ ์ํด GitHub ์ด์, StackExchange ๋ฑ์ ์ค์บํ๋ ๊ฒ๋ณด๋ค _vastly_ ๋ซ์ต๋๋ค.
แ แ แ แ แ แ แ : tada : @types
์ ๋ํ ๊ฒฝ๋ก ํญ๋ชฉ์ด ๋ง์นจ๋ด ๋ด ๋นํ์ค ํ๋ก์ ํธ ์ค์ ์ ์๋ํ๊ฒ ๋ง๋๋ ๋๋ฝ ๋ ๋ถ๋ถ์ด์์ต๋๋ค. ๋๋ ์ด๊ฒ์ ๋ฉฐ์น ์ ๋ณด๋๋ค.
์์ฉ ํ๋ก๊ทธ๋จ ์์ ํ๋ก์ธ์ค๋ฅผ ์ฝ๊ฐ ๋ฆ์ถ์ด๋ ๊ด์ฐฎ๋ค๋ฉด package.json์ ์์ ์คํฌ๋ฆฝํธ์ TS_NODE_FILES=true
๋ฅผ ์ถ๊ฐํ๋ฉด ๋ชจ๋ ์ฌ์ฉ์ ์ ์ ์ ์ธ ํ์ผ์ ์ฐพ์ ์ ์์ต๋๋ค.
๋๋ ์ง๊ธ ๋ฐ๊ณ ์๋ค :
The following changes are being made to your tsconfig.json file:
- compilerOptions.paths must not be set (aliased imports are not supported)
์ด ์ต์ ์ ์ญ์ ์ค์ ๋๋ค.
@KrzysztofMadejski ๋ TS ์์ฒด๊ฐ ์๋๋ผ CRA์ ์ํด ์ํ๋์์ต๋๋ค.
์ด ์ค๋ ๋๋ typeroots๊ฐ ์ค์ ๋ก ์ด์ ๋ฒ์ ๊ณผ์ ํธํ์ฑ์์ํ ๊ฒ์ด๋ผ๊ณ ๋งํฉ๋๋ค. ๋๋ ๊ทธ๊ฒ์ ์ฌ์ฉํ์ฌ ์ ํ์ ์์ฑํ๋ ๋ฐ ์ฌ์ฉํ๋ ค๊ณ ํฉ๋๋ค. typeroot์์ด ์ด๋ฌํ ์ ํ์ ์ ๋๋ก ํ
์คํธํ๋ ค๋ฉด ์ด๋ป๊ฒํด์ผํฉ๋๊น? dts-gen
์ฌ์ฉํ์ฌ ์ ํ์ ์์ฑํ๊ณ ์ ํ ๋ฃจํธ์ types
์ ์ถ๊ฐํ์ง๋ง ์ฌ์ ํ ์ด์ด ์์ต๋๋ค :-(
@Roaders dts-gen
์์ฑ ์ ํ์ ์ฌ์ฉํ๋ ์๋ฃจ์
์ ์ฐพ์์ต๋๊น?
ํธ์ง : https://github.com/microsoft/TypeScript/issues/22217#issuecomment -369783776์ผ๋ก ํด๊ฒฐ๋์์ต๋๋ค.
๋ด๊ฐ ์ฌ๊ธฐ์ ์ดํดํ์ง ๋ชปํ๋ ํ ๊ฐ์ง๋ ๋ค์๊ณผ ๊ฐ์ต๋๋ค.
tsconfig.base.json :
"typeRoots": ["node_modules/@types", "types"],
๊ทธ๋ฆฌ๊ณ ๋๋ ํ ๋ฆฌ ๊ตฌ์กฐ :
/node_modules/@types/something/index.d.ts
/types/something-else/index.d.ts
๋ด nrwl / nx ์ ์ฅ์์์ ์ ํ ์ ํ๋์ง ์์ต๋๋ค. ๋ฐฑ๋ง ๊ฐ์ง๋ฅผ ์๋ํด ๋ณผ ์ ์์ง๋ง something-else
ํด๋๋ฅผ node_modules/@types
๋ก ์ฎ๊ธฐ๋ฉด ๋ง์ ์ฒ๋ผ ์๋ํ๊ณ ์ ํ ๋ ๊ฒ์
๋๋ค. ์ด๋ typeRoots
๊ฐ node_modules/@types
๋งํผ ์๋ฌด๊ฒ๋ํ์ง ์๋๋ค๋ ๊ฒ์ ์๋ฏธํฉ๋๋ค
typeRoots๋ฅผ deprecated๋ก ํ์ํ๊ณ ์ด์ํ๊ณ ๊ธฐ๋ฐํ ๋ฐฉ์์ผ๋ก ์๋ํ๋ค๊ณ ๋งํ๋ฉด ์ ์ด๋ ์ฌ์ฉํ๋ ค๋ ์๋๊ฐ ์ค๋จ๋์์ ๊ฒ์ ๋๋ค.
๋ด๊ฐ ํ์๋ก ํ ๋๋ง๋ค ๋ก์ปฌ ์ ํ์ ์ถ๊ฐ ํ ์ ์์๋ ์ ์ผํ ๋ฐฉ๋ฒ์ tsconfig.base.json๊ณผ ์ธ์ฐ๊ณ ์์ mhegazy ์ฃผ์์ ๊ฑธ๋ ค ๋์ด์ง๋ ์๊ฐ์ ๋ณด๋ด๋ ๊ฒ์ ๋๋ค.
๋๋ ์ด๊ฒ์ ๊ณ์ ๋ฌผ๋ ค์ paths
์ต์
์ ๊ตฌ์ฑํด์ผํ๋ ๊ฒ์ ์์ ๊ธฐ ๋๋ฌธ์ ์ ์ ํ ์ค์ ์ผ๋ก ๊ฐ๋จํ ์ ์ฅ์ ๋ฅผ ๋ง๋ค์์ต๋๋ค. ๋๊ตฐ๊ฐ์๊ฒ ๋์์ด๋๊ธฐ๋ฅผ ๋ฐ๋๋๋ค.
๊ฐ์ฅ ์ ์ฉํ ๋๊ธ
@mhegazy ๋ฌธ์๊ฐ ๊ฑฐ์ ๋๋ ์ ํ์๋ ์ง์ ๊ธฐ๋ฅ์ด ์๋ค๋ ๊ฒ์ ํผ๋์ ์ผ๊ธฐํฉ๋๋ค. ์ด์ ๊ฐ์ ๊ธฐ๋ฅ์ ์ ์ ํ๊ฒ ๋ฌธ์ํํ๋ ๊ฒฝ๊ณ ์ธ์ด๋ก ์์ ๋กญ๊ฒ ์์ฑ ํ์ญ์์ค. ์๋ฅผ ๋ค๋ฉด :
์ด๊ฒ์ ์ ๋ณด๋ฅผ ์ํด GitHub ์ด์, StackExchange ๋ฑ์ ์ค์บํ๋ ๊ฒ๋ณด๋ค _vastly_ ๋ซ์ต๋๋ค.