typescript, eslint, webpack Alias 설정하기

// webpack.config.js
{
...,
resolve: {
    extensions: ['.jsx', '.ts', '.tsx', '.js'],
    alias: {
      '@': path.resolve(__dirname, 'src/'),
      '@Route': path.resolve(__dirname, 'src/route/'),
      '@Pages': path.resolve(__dirname, 'src/pages/'),
      '@Components': path.resolve(__dirname, 'src/components/'),
      '@Style': path.resolve(__dirname, 'public/scss/'),
      '@Public': path.resolve(__dirname, 'public/'),
      '@Config': path.resolve(__dirname, 'src/config/'),
      '@Stores': path.resolve(__dirname, 'src/store/stores/'),
      '@types': path.resolve(__dirname, '../@types/'),
    },
  }
}

 

// eslintrc.json
{
  "settings": {
    "import/parsers": {
      "@typescript-eslint/parser": [".ts", ".tsx"]
    },
    "import/resolver": {
      "typescript": "./tsconfig.json"
    }
  },
}

 

// tsconfig.json
{...,
    "paths": {
      "@/*": ["src/*"],
      "@Route/*": ["src/route/*"],
      "@Pages/*": ["src/pages/*"],
      "@Components/*": ["src/components/*"],
      "@Style/*": ["public/scss/*"],
      "@Public/*": ["public/*"],
      "@Config/*": ["src/config/*"],
      "@Json/*": ["src/json/*"],
      "@Stores/*": ["src/store/stores/*"],
      "@Types/*": ["../@types/*"]
    }
}