[React] 절대경로 설정

1. craco install

npm i @craco/craco
npm i -D craco-alias

 

2. package json script 수정

...

"scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "craco eject"
  },
  
  ...

 

3. tsconfig 설정

// tsconfig.path.json

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

{
  "extends": "./tsconfig.path.json",
  "compilerOptions": {
    "target": "es6",
    "module": "esnext",
    "moduleResolution": "node",
    "noResolve": false,
    
	...
    
}

 

4. carco 설정

// craco.config.js

const CracoAlias = require("craco-alias");
module.exports = {
  plugins: [
    {
      plugin: CracoAlias,
      options: {
        source: "jsconfig",
        jsConfigPath: "jsconfig.paths.json",
      },
    },
  ],
};