안녕하세요. 제로초님 당신의 강의 매니아 입니다. typescript 모듈 관련 질문이 있어서요.

정말 이부분이 궁금하고, 제가 chatgpt나 구글링 모든 방법을 다 동원해서 찾아 보았는데도, 궁금증 및 해결 방법을 찾을 수 가 없어서 혹시나 하는 마음에 질문을 남기게 되었습니다.

질문은 typescript 모듈 관련 질문 입니다.

react + typescript 개발을 하다가 깜빡하고 export를 빼먹은 적이 있었는데, 정말로 신기하게도 interface를 사용하고자 하는곳에서 import도 없어도 에러가 나지 않고 사용이 가능했습니다.

a.interface에서 타입 선언

b.component.tsx에서 사용

그래서 이부분이 궁금해서 꼭 이해하고 넘어가고 싶어서

ts 기본세팅을 해서 테스트 해보았고

//second.ts

//import meal없음
const lunch: meal = {
  menu: "ff",
};

//first.ts

interface meal {
  menu: string;
}
//export없음

not found meal 에러가 날줄 알았으나, 아무 이상 없이 작동함.

이거 굉장히 흥미롭다 생각해서 이번엔 nest.js에서 실험 해보았습니다.

//src/boards/boards.controller.ts

interface meal {
  menu: string;
}
//export없음

//src/boards/boards.service.ts

//import meal없음
const lunch: meal = {
  menu: "ff",
};

nest.js에서 tsconfig.ts

{
	"compilerOptions": {
		"module": "commonjs",
		"declaration": true,
		"removeComments": true,
		"emitDecoratorMetadata": true,
		"experimentalDecorators": true,
		"allowSyntheticDefaultImports": true,
		"target": "ES2021",
		"sourceMap": true,
		"outDir": "./dist",
		"incremental": true,
		"strict": true,
		"skipLibCheck": true,
		"strictNullChecks": true,
		"strictBindCallApply": true,
		"forceConsistentCasingInFileNames": true,
		"noImplicitAny": true,
		"noFallthroughCasesInSwitch": true,
		"baseUrl": "./",
		"esModuleInterop": true, // 추가
		"paths": {
			"@/*": ["src/*"],
			"test/*": ["test/*"]
		}
	}
}

당연히 또 에러 없이 될줄 알았으나

에러발생: Cannot find name 'meal'.

??? 이거 저만 이해 안가나요.

여러번의 삽질의 끝에 또 한가지 흥미로운 사실을 알게 되었습니다.

nest.js에서는 src 밖에다가

//first.ts

//second.ts

만들어서 위와 똑같이 코드 작성하면 또 에러가 발생하지 않습니다.

정리하면,

우선적으로, 특정 경로 설정을 하지 않으면, 어디서든 사용이 가능한것 같습니다. (nestjs에서 src같은 설정)

1. react-typescript에서 export없이 interface선언 import 없이 다른파일 export없는 interface 사용가능

2. ts init로 typescript 프로젝트 처음부터 만들어서 export없이 interface선언 import 없이 다른파일 export없는 interface 사용가능

3. nest.js에서 export없이 interface선언 import 없이 다른파일 export없는 interface 사용가능, 하지만 src 폴더 밖에서만 가능!

질문은 결론적으로 질문은

1. 어떻게해서 이게 동작 하는건지가 너무 궁금 합니다.

2. nestjs에서 src처럼 export import없이 사용 불가능하게 하려면 어떻게 해야할지...?

interface meal {
  menu: string;
}
//export없음

//import meal없음
const lunch: meal = {
  menu: "ff",
};