tsconfig 환경설정

-

tsconfig.json 환경설정


기존 디폴트로 설정된 파일의 내용은 삭제후 아래와 같이 환경설정을 한다.

{
  "compilerOptions": {
    "target": "ESNext",
    "useDefineForClassFields": true,
    "lib": ["DOM", "DOM.Iterable", "ESNext"],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": false,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": false,
    "module": "ESNext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noImplicitAny": false,
    "noEmit": false,
    "declaration": true,
    "declarationDir": "./types",
    "jsx": "preserve",
    "baseUrl": "..",
    "paths": {
      "~/*": ["./client/src/*"],
      "test/*": ["./client/test/*"],
      "*": ["./client/*", "../node_modules/*"],
      "librechat-data-provider/*": ["./packages/data-provider/*"]
    }
  },
  "types": ["node", "jest", "@testing-library/jest-dom"],
  "exclude": ["node_modules", "vite.config.ts"],
  "include": [
    "src/**/*",
    "test/**/*",
    "../e2e/**/*",
    "test/setupTests.js",
    "env.d.ts",
    "../config/translations/**/*.ts"
  ]
}


tsconfig.json 파일은 TypeScript 컴파일러가 프로젝트를 컴파일하는 방식을 정의하는 데 사용됩니다. TypeScript 프로젝트에서 이 파일은 매우 중요하며, 코드의 타입 검사, 모듈 해석, 출력 방식 등을 제어합니다.

compilerOptions

이 객체는 TypeScript 컴파일러의 동작 방식을 구성하는 핵심 부분입니다.

  • target: "ESNext": 컴파일된 JavaScript 코드가 어떤 ECMAScript 버전으로 출력될지 지정합니다. "ESNext"는 가장 최신 버전의 ECMAScript 기능을 사용하겠다는 의미입니다.
  • useDefineForClassFields: true: 클래스 필드를 Object.defineProperty를 사용하여 정의할지 여부를 지정합니다. 이는 최신 JavaScript 표준과 더 잘 호환되게 합니다.
  • lib: ["DOM", "DOM.Iterable", "ESNext"]: 프로젝트에 포함할 기본 라이브러리 선언 파일을 지정합니다.
    • "DOM": 브라우저 환경의 표준 DOM(Document Object Model) API를 지원합니다.
    • "DOM.Iterable": DOM 관련 Iterable 프로토콜을 지원합니다.
    • "ESNext": 최신 ECMAScript 기능에 대한 타입 정의를 포함합니다.
  • allowJs: true: TypeScript 프로젝트에서 .js 및 .jsx 파일을 허용합니다. 즉, JavaScript 파일과 TypeScript 파일을 함께 사용할 수 있습니다.
  • skipLibCheck: true: 모든 선언 파일(*.d.ts)의 타입 검사를 건너뜁니다. 주로 node_modules 내부의 라이브러리에서 발생하는 타입 오류를 무시하여 컴파일 시간을 단축하고 빌드 실패를 줄이는 데 사용됩니다.
  • esModuleInterop: false: CommonJS 모듈과 ES 모듈 간의 상호 운용성을 처리하는 방식을 비활성화합니다. 이 설정을 true로 하면 ES 모듈의 import * as React from 'react' 같은 구문을 import React from 'react'로 사용할 수 있게 해줍니다. 여기서는 `false``로 되어 있어 명시적인 CommonJS/ES 모듈 임포트 규칙을 따릅니다.
  • allowSyntheticDefaultImports: true: esModuleInterop이 false일 때, 기본 내보내기가 없는 모듈에서 기본 임포트(e.g., import React from 'react')를 허용합니다. 이는 일부 라이브러리에서 발생할 수 있는 문제를 해결하는 데 도움이 됩니다.
  • strict: true: 엄격한 타입 검사 옵션을 모두 활성화합니다. 이는 코드의 안정성과 가독성을 높이는 데 권장됩니다.
  • forceConsistentCasingInFileNames: false: 파일 이름의 대소문자 일관성을 강제하지 않습니다. 일반적으로 true로 설정하여 대소문자로 인한 문제를 방지하는 것이 좋지만, 여기서는 false로 되어 있습니다.
  • module: "ESNext": 생성될 모듈 코드의 종류를 지정합니다. "ESNext"는 ES Modules 형식을 사용하며, 이는 최신 브라우저와 번들러에 적합합니다.
  • moduleResolution: "node": 모듈을 해석하는 방식을 Node.js 방식으로 따릅니다. 이는 node_modules 디렉토리에서 모듈을 찾는 방식과 유사합니다.
  • resolveJsonModule: true: .json 파일을 모듈로 가져올 수 있도록 허용합니다.
  • isolatedModules: true: 각 파일을 독립적인 모듈로 간주합니다. 이는 Babel과 같은 트랜스파일러가 파일을 단일 파일로 처리하는 방식과 유사하며, 특정 타입스크립트 기능(e.g., const enum) 사용을 제한할 수 있습니다.
  • noImplicitAny: false: 명시적으로 타입을 선언하지 않은 경우 any 타입을 암시적으로 사용하는 것을 허용합니다. strict: true를 설정했음에도 불구하고 noImplicitAny를 false로 명시적으로 재정의한 것으로 보입니다. 일반적으로 true로 설정하여 타입 안정성을 높이는 것이 권장됩니다.
  • noEmit: false: TypeScript 컴파일러가 JavaScript 파일을 출력하는 것을 허용합니다. true로 설정하면 타입 검사만 수행하고 실제 파일은 생성하지 않습니다. 이 설정은 주로 번들러(예: Vite, Webpack)가 트랜스파일을 담당할 때 사용됩니다.
  • declaration: true: 컴파일 시 .d.ts 선언 파일을 생성합니다. 이는 라이브러리를 만들 때 다른 TypeScript 프로젝트에서 타입 정보를 활용할 수 있도록 해줍니다.
  • declarationDir: "./types": 생성된 선언 파일(*.d.ts)이 저장될 디렉토리를 지정합니다. 여기서는 프로젝트 루트의 ./types 디렉토리에 저장됩니다.
  • jsx: "preserve": JSX 구문을 컴파일러가 그대로 유지하도록 지시합니다. JSX 트랜스폼은 Babel이나 Vite와 같은 다른 도구에서 처리할 것으로 예상됩니다.
  • baseUrl: "..": 모듈 해석의 기준 경로를 지정합니다. "../"는 현재 tsconfig.json 파일이 위치한 디렉토리의 상위 디렉토리를 기준으로 합니다.
  • paths: 모듈 임포트 경로에 대한 별칭(alias)을 정의합니다. 이는 긴 상대 경로 대신 짧은 별칭을 사용하여 모듈을 임포트할 수 있게 해줍니다.
    • "~/*": ["./client/src/*"]: ~/로 시작하는 경로는 ./client/src/ 디렉토리를 가리킵니다. (예: import someModule from '~/components/SomeComponent';)
    • "test/*": ["./client/test/*"]: test/로 시작하는 경로는 ./client/test/ 디렉토리를 가리킵니다.
    • "*": ["./client/*", "../node_modules/*"]: 모든 경로에 대해 먼저 ./client/ 디렉토리에서 모듈을 찾고, 없으면 ../node_modules/에서 찾도록 합니다.
    • "librechat-data-provider/*": ["./packages/data-provider/*"]: librechat-data-provider/로 시작하는 경로는 ./packages/data-provider/ 디렉토리를 가리킵니다.

types

  • "node", "jest", "@testing-library/jest-dom": 프로젝트에서 전역 타입으로 사용할 타입 정의 패키지를 명시적으로 지정합니다.
    • node: Node.js 환경에서 사용되는 전역 타입 (e.g., process, Buffer).
    • jest: Jest 테스트 프레임워크 관련 전역 타입.
    • @testing-library/jest-dom: Jest DOM 확장 라이브러리 관련 타입.

exclude

컴파일러가 타입 검사에서 제외할 파일 또는 디렉토리를 지정합니다.

  • "node_modules": 일반적으로 모든 의존성 패키지가 있는 디렉토리이므로 제외합니다.
  • "vite.config.ts": Vite 설정 파일은 일반적으로 번들링 과정에서 처리되므로 타입스크립트 컴파일 과정에서는 제외합니다.

include

컴파일러가 타입 검사를 포함할 파일 또는 디렉토리를 지정합니다. 이 경로에 있는 파일들만 컴파일됩니다.

  • "src/**/*": src 디렉토리 아래의 모든 파일과 하위 디렉토리를 포함합니다.
  • "test/**/*": test 디렉토리 아래의 모든 파일과 하위 디렉토리를 포함합니다.
  • "../e2e/**/*": 현재 디렉토리의 상위 디렉토리에 있는 e2e 디렉토리 아래의 모든 파일과 하위 디렉토리를 포함합니다.
  • "test/setupTests.js": 특정 테스트 설정 JavaScript 파일을 포함합니다.
  • "env.d.ts": 환경 변수 타입 정의 파일을 포함합니다.
  • "../config/translations/**/*.ts": 현재 디렉토리의 상위 디렉토리에 있는 config/translations 디렉토리 아래의 모든 TypeScript 파일을 포함합니다.

요약

이 tsconfig.json 파일은 프런트엔드 애플리케이션(아마도 React/Vite 기반) 개발을 위한 설정을 주로 담고 있습니다.

  • 최신 JavaScript 기능을 사용하고 JSX 구문을 보존하여 번들러가 처리하도록 합니다.
  • 엄격한 타입 검사(strict: true)를 활성화하여 코드 품질을 높이지만, noImplicitAny: false로 일부 유연성을 둡니다.
  • 모듈 해석 방식을 Node.js와 유사하게 설정하고, JSON 모듈 임포트를 허용합니다.
  • **경로 별칭(paths)**을 통해 복잡한 임포트 경로를 단순화하여 개발 편의성을 높였습니다.
  • Node.js, Jest, Testing Library와 같은 테스트 환경을 위한 타입 정의를 포함합니다.
  • 프로젝트의 소스 코드, 테스트 코드, E2E 테스트 코드, 설정 파일 등을 컴파일 대상에 명확히 지정하여 필요한 파일만 처리하도록 구성되어 있습니다.

이 설정은 개발자가 타입스크립트의 강력한 타입 시스템을 활용하면서도, 현대 웹 개발 워크플로우(번들러 사용, JSX)에 잘 통합될 수 있도록 고안 되었습니다.

댓글

댓글 쓰기

이 블로그의 인기 게시물

아파치 보안관련 기본설정

-
 🔧 기본 설정 항목들 1. ServerTokens & ServerSignature 설명 : Apache가 클라이언트에게 서버 정보를 얼마나 제공할지 결정함. 보안 권장 설정 : ServerTokens Prod ServerSignature Off Prod : 버전 정보 없이 "Apache"만 반환. Off : 에러 페이지나 디렉토리 목록에 서버 정보 숨김. 2. Timeout 설명 : 클라이언트와의 연결에 대해 Apache가 기다리는 시간. 권장 설정 (성능 및 DoS 방지): Timeout 30 기본값 60초 → 30초로 줄이면 유휴 연결을 빠르게 정리 가능. 3. KeepAlive & MaxKeepAliveRequests 설명 : 하나의 TCP 연결로 여러 요청을 처리할 수 있게 함. 권장 설정 : KeepAlive On MaxKeepAliveRequests 100 KeepAliveTimeout 5 KeepAliveTimeout 은 너무 길면 자원 낭비. 일반적으로 2~5초 권장. 4. 디렉토리 보호 설정 <Directory /var/www/html>     Options -Indexes     AllowOverride None     Require all granted </Directory> -Indexes : 디렉토리 인덱싱 비활성화. -  AllowOverride None : .htaccess 비활성화하여 보안 강화. Apache에서 HttpOnly 쿠키 설정하기 ✅ 방법 1: Apache에서 Set-Cookie 에 HttpOnly 추가하기 <IfModule mod_headers.c> Header edit Set-Cookie ^(.*)$ "$1;HttpOnly;Secure" </IfModule> 🔎 설명: mod_headers 모듈을 사용하여 모든 Set...
자세한 내용 보기

티베로 이관 작업 절차

-
티베로 이관 작업 절차 /* 기존 DB 환경 파악 신규 DB설치시 NLS_CHARACTERSET, DB_BLOCK_SIZE 기존과 동일해야 데이터 import 시 오류없이 import 된다. */ /*1.  터미널에서 기존 db 접속후 환경 파악 */ /* 티베로 db 접속 */ /* tbsql 사용자/패스워드@sid */ tbsql sys/tibero@SID /* DB_BLOCK_SIZE 확인 */ SHOW PARAMETER DB_BLOCK_SIZE SQL> SHOW PARAMETER DB_BLOCK_SIZE NAME                         TYPE     VALUE ---------------------------- -------- ---------------------------------------- DB_BLOCK_SIZE                INT32    8192 /* CHARACTER_SET 확인 */ SQL>  SELECT * FROM SYS._VT_NLS_CHARACTER_SET; CHARACTERSET_NAME NCHAR_CHARACTERSET_NAME ----------------- ----------------------- MSWIN949          UTF16 /*2. 테이블 스페이스 생성 스크립트 실제테이블 스크립트 용량 계산 추출 */ set linesize 1000 set pagesize 50000 set trimspool on spool create_tablespace.sql SELECT 'create tablespace ' || TABLESPACE_NAME || ' datafile ''' || ...
자세한 내용 보기

윈도우 네트워크 리소스 사용권한 오류

-
이미지
윈도우에서 네트워크 공유 오류 처리 이 네트워크 리소스를 사용할 권한이 없는 것 같습니다. 이 서버의 관리자에게 문의하여 액세스 권한이 있는지 확인하십시시오. 이렇게 메세지 뜨고 공유가 안될경우 cmd 콘솔창을 띄워서 기존에 등록되어 있는 연결정보를 다 삭제 하고 다시 접속하면 연결이 된다. 연결된 정보 확인 cmd 창에서  net use C:\Windows\System32>net use 새 연결 정보가 저장됩니다. 상태         로컬      원격                      네트워크 ------------------------------------------------------------------------------- OK                     \\192.168.6.20\IPC$       Microsoft Windows Network 명령을 잘 실행했습니다. 확인후 연결 끊기 net use /delete * 실행후 y를 눌러서 계속하면 현재 연결을 끊어 버립니다. 연결을 끊고 다시 네트워크 접속을 하면 정상적으로 접속이 됩니다. 전체가 아니고 해당 연결만 삭제 하는 방법은 net use /delete \\공유폴더명 위와 같이 하여도 해결이 안 될 경우 자경증명 관리자에서 저장된 자격증명 삭제하기 윈도우 키를 누른후 자격 증명 관리자 실행   자격증명 관리자 메뉴에 들어가서 Windows 자격증명 메뉴를 클릭하여 오류가 나는 아이피를 선택하여 제거 하고 다시 접속합니다.
자세한 내용 보기