INTRO

파일 경로 설정방법에 대해...
./src/home/app.js => @/home/app.js

./config/webpack.common.js

...
resolve: {
      extensions: [".ts", ".tsx", ".js", ".jsx", ".json", ".css", ".scss"],
      alias: { "@": path.resolve(process.cwd(), "src") },
      symlinks: false,
      cacheWithContext: false
    },
...

ex) ./src/home/app.jsb => @/home/app.js

기호에 맞게 @home, @hooks 등을 추가 하면 되지만 구지 구차쿠로

위 webpack설정을 통해 소스에서 "@" alias 사용이 가능 해진다.

마지막으로 vscode 인텔리전스가 파악 할수 있도록 해준다.

./tsconfig.json

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@/*": ["src/*"]
    },
...

@/index.tsx

index.tsx에서 App import하는 부분을 alias 를 적용 해보자

import React, { StrictMode } from "react";
import { createRoot } from "react-dom/client";
import App from "@/App"; // import App from "./App"
...

아래와 같이 안내가 잘뜨면 정상