diff --git a/.yarn/build-state.yml b/.yarn/build-state.yml
index d92ef942..0a548ecc 100644
--- a/.yarn/build-state.yml
+++ b/.yarn/build-state.yml
@@ -3,20 +3,20 @@
 
 # core-js-pure@npm:3.15.2
 "2b9d54bed09edbafda0a9ce9f0deda44bf0efa20a7b5f95fe23989dc8c819b47060dc585fe847db1ac1bd37446f744ace40b4f278c3dd220a77dbead039008ef":
-  eb6857e4683392fba0b68f36b4d0dd0d4b001db6145975b4f11e8b130f9a728f6c9b89615651e2ace03b30a688f37e797ac6290f6fb933c1fe735dea28dc7295
+  69aad89bf5f246e29ef7dd093c93a80ae18b13c246669c34d1888e15f2c1cd72e05661a9e7d2422bb56a13e38868648ad9a0cda9e137b412050a0996bb264246
 
 # core-js@npm:2.6.12
 "0b93d77d31629ea22008e81fc0f5432252f9d8d4985cb82c4253a1aa05054d1dc0f9f59daf4668987876afb8a8adc93e90748dfdcc90cd8312236b6ebc616a70":
-  a19a7eee0bc83fdddf67afd293921ae1be5ee227a98a272300358148f36a54f727d8cc13249a6f93bc11b58494502bbee1fdfaec35d61b9a471a49f085ddaf7e
+  4e812c3b5eae1ee2e41011a4dbcc6ad6938f20233384b1e7bb763d4171966b3c7e6e8ad73bcfcd116941342a08f18dfaa37a411de985b930413c214b3c91f8f6
 
 # core-js@npm:3.15.2
 "6825052e106ce6ce8698952435c5ffbf482aa0c3cb5ecc901d7a0c7e5d39bd3e7df34bb42d53780c9a05ed0f299a233b9d54c689f2f5489bdc46ee55393184f2":
-  85c12cdc1edc9c673fc14fdc5bdb424c63b2dc40a1d040d3b41a25eb0aea321af1b042e2ba27ef39b257970a557e0fc2bba0a4919bd943860d2672880ec55ee3
+  24c37451aa43488548f0ad13d41f98d1daa2005fab2067bb107ca659de7633da2560e4a59f6507e6c7cf530439cb68f4b57b3205eb101b93d15c6fd9ae6fc561
 
 # ejs@npm:2.7.4
 "879ed38a4e6f542ab08c36367888dd2c675bef03e81327d75da644a9795ff2d91c34d3cc00a725a6332b56c51ff7cd6a6c5e8c9f9411e6c41bf42b356e1e2417":
-  2800ae71516d923f0cce751da8b86c87467e806468d8785fef7e5169fab9651e9fd4a2486f17f03c965e2a21201631e9a41a3c2a570d783e6864b45c85337187
+  f3f9f4372164a036af0fce1295bcc52fcc59f4c822bb06ff6e7871e4efd2fd0e199bd1c234592f0494b0080fb34417e015cff6266d2362802b89fa1a2bbf1503
 
 # fsevents@patch:fsevents@npm%3A1.2.13#builtin<compat/fsevents>::version=1.2.13&hash=11e9ea
 "268c0b888ddfb611722b2ffd60f6a12729aed7f4e910e41b46d22ec5d652b177b3680e939f37b6278ca5903c81ec55105f93c7fc0944e125761166786225180b":
-  d807b649214af472bd6a8ddf89c1cfc2161f81fa3791b063e6759e1ed4a4d428d804b4c76c244d717024ba53415ee7b6161a4740d8d3b63ae86086d0341baf2f
+  0e0f75053d908a61aae244491494c388c78ae15af8a897f95e612ed61c56a921df9621399cc5609b1a3fc99d03546f9ebbc1493e7f6915a9c1f70dd2e67c2a87
diff --git a/.yarn/install-state.gz b/.yarn/install-state.gz
index 2bfa6433..62ed1d80 100644
Binary files a/.yarn/install-state.gz and b/.yarn/install-state.gz differ
diff --git a/package.json b/package.json
index 23992a6a..40aaadf7 100644
--- a/package.json
+++ b/package.json
@@ -32,7 +32,7 @@
   "scripts": {
     "dev": "yarn start",
     "start": "start-storybook -p 6006 --no-dll --no-manager-cache",
-    "build": "yarn clean && rollup -c && yarn copy && tsc --emitDeclarationOnly -p ./tsconfig.build.json",
+    "build": "yarn clean && rollup -c && yarn copy && tsc --emitDeclarationOnly -p ./tsconfig.json",
     "build-stories": "yarn build-storybook -o ./storybook-static -s ./public --docs",
     "publish-stories": "node ./.storybook/deploy.js",
     "test": "react-scripts test",
@@ -41,7 +41,7 @@
     "copy": "ncp package.json dist/package.json",
     "copy-sass": "ncp src/sass/modules dist/sass",
     "copy-version": "ncp dist/package.json package.json",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit -p ./tsconfig.json"
   },
   "eslintConfig": {
     "extends": [
@@ -120,7 +120,7 @@
     "rollup-plugin-typescript2": "^0.29.0",
     "sass": "^1.29.0",
     "semantic-release": "^17.2.4",
-    "tsconfig-paths-webpack-plugin": "^3.3.0",
+    "tsconfig-paths-webpack-plugin": "^3.5.1",
     "typescript": "^4.0.3",
     "webpack-hot-middleware": "^2.25.0"
   }
diff --git a/src/components/Accordion/index.tsx b/src/components/Accordion/index.tsx
index 51e04001..066e7955 100644
--- a/src/components/Accordion/index.tsx
+++ b/src/components/Accordion/index.tsx
@@ -1,10 +1,10 @@
 import { forwardRef, useEffect, useRef, useState } from 'react';
-import { CombineElementProps } from 'src/types/utils';
+import { CombineElementProps } from '../../types/utils';
 import classnames from 'classnames';
 import Icon from '../Icon';
 import Text from '../Text';
-import { colors } from 'src/constants/colors';
-import { useElementSize } from 'src';
+import { colors } from '../../constants/colors';
+import useElementSize from '../../hooks/useElementSize';
 
 type Props = CombineElementProps<
   'div',
diff --git a/src/components/Button/index.tsx b/src/components/Button/index.tsx
index 29046e66..05a9d5be 100644
--- a/src/components/Button/index.tsx
+++ b/src/components/Button/index.tsx
@@ -1,8 +1,8 @@
 import { Ref, forwardRef } from 'react';
 import classnames from 'classnames';
-import { CombineElementProps } from 'src/types/utils';
+import { CombineElementProps } from '../../types/utils';
 import Text from '../Text';
-import { SemanticColor } from 'src/constants/colors';
+import { SemanticColor } from '../../constants/colors';
 
 interface ButtonBaseProps {
   size?: 'small' | 'medium' | 'large';
diff --git a/src/components/Grid/Column.tsx b/src/components/Grid/Column.tsx
index 121f145d..3041a5ff 100644
--- a/src/components/Grid/Column.tsx
+++ b/src/components/Grid/Column.tsx
@@ -1,6 +1,6 @@
-import React, { ElementType, useMemo } from 'react';
+import { ElementType, useMemo, forwardRef } from 'react';
 import { ColumnSize, ColumnResponsive, DEFAULT_ELEMENT } from './types';
-import { OverridableProps } from 'types/OverridableProps';
+import { OverridableProps } from '../../types/OverridableProps';
 import classNames from 'classnames';
 
 const sizes: ColumnResponsive[] = ['xl', 'lg', 'md', 'sm', 'xs'];
@@ -39,4 +39,4 @@ const Column = <T extends React.ElementType = typeof DEFAULT_ELEMENT>(
   );
 };
 
-export default React.forwardRef(Column) as typeof Column;
+export default forwardRef(Column) as typeof Column;
diff --git a/src/components/Grid/Row.tsx b/src/components/Grid/Row.tsx
index 0feac3a5..da14efbc 100644
--- a/src/components/Grid/Row.tsx
+++ b/src/components/Grid/Row.tsx
@@ -1,7 +1,7 @@
 import { ElementType, Ref, forwardRef } from 'react';
 import { DEFAULT_ELEMENT } from './types';
 import classnames from 'classnames';
-import { OverridableProps } from 'src/types/OverridableProps';
+import { OverridableProps } from '../../types/OverridableProps';
 
 type BaseAlign = 'flex-start' | 'center' | 'flex-end';
 interface RowBaseProps {
diff --git a/src/components/Icon/index.tsx b/src/components/Icon/index.tsx
index 2e021765..6dfd59fb 100644
--- a/src/components/Icon/index.tsx
+++ b/src/components/Icon/index.tsx
@@ -1,8 +1,8 @@
 import { useEffect, useState } from 'react';
 import classnames from 'classnames';
-import { colors } from 'src/constants/colors';
-import { CombineElementProps } from 'src/types/utils';
-import { IconName } from 'src/types/icon';
+import { colors } from '../../constants/colors';
+import { CombineElementProps } from '../../types/utils';
+import { IconName } from '../../types/icon';
 import { fetchIcon, getIconName, getIconType, getIconUrl } from './utils';
 
 const iconCache: Record<string, string> = {};
diff --git a/src/components/LubyconUIKitProvider/index.tsx b/src/components/LubyconUIKitProvider/index.tsx
index 5d7f87ef..505d568c 100644
--- a/src/components/LubyconUIKitProvider/index.tsx
+++ b/src/components/LubyconUIKitProvider/index.tsx
@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
-import { PortalProvider } from 'contexts/Portal';
-import { OverlayProvider } from 'contexts/Overlay';
+import { PortalProvider } from '../../contexts/Portal';
+import { OverlayProvider } from '../../contexts/Overlay';
 
 interface Props {
   children: ReactNode;
diff --git a/src/components/Skeleton/Circle.tsx b/src/components/Skeleton/Circle.tsx
index 92507f58..7c89c325 100644
--- a/src/components/Skeleton/Circle.tsx
+++ b/src/components/Skeleton/Circle.tsx
@@ -1,4 +1,4 @@
-import { CombineElementProps } from 'src/types/utils';
+import { CombineElementProps } from '../../types/utils';
 
 type Props = Omit<
   CombineElementProps<
diff --git a/src/components/Skeleton/Rect.tsx b/src/components/Skeleton/Rect.tsx
index ce2bfb8e..cc14d59a 100644
--- a/src/components/Skeleton/Rect.tsx
+++ b/src/components/Skeleton/Rect.tsx
@@ -1,4 +1,4 @@
-import { CombineElementProps } from 'src/types/utils';
+import { CombineElementProps } from '../../types/utils';
 
 type Props = Omit<
   CombineElementProps<
diff --git a/src/components/Skeleton/index.tsx b/src/components/Skeleton/index.tsx
index 9b478bb6..0cbb005f 100644
--- a/src/components/Skeleton/index.tsx
+++ b/src/components/Skeleton/index.tsx
@@ -1,5 +1,5 @@
-import { CombineElementProps } from 'src/types/utils';
-import { colors } from 'src/constants/colors';
+import { CombineElementProps } from '../../types/utils';
+import { colors } from '../../constants/colors';
 import { useAnimateGradient } from './useAnimateGradient';
 import Rect from './Rect';
 import Circle from './Circle';
diff --git a/src/components/Skeleton/useAnimateGradient.tsx b/src/components/Skeleton/useAnimateGradient.tsx
index 2aa15e73..56206607 100644
--- a/src/components/Skeleton/useAnimateGradient.tsx
+++ b/src/components/Skeleton/useAnimateGradient.tsx
@@ -1,6 +1,5 @@
-import { useCallback } from 'react';
-import { useState } from 'react';
-import { useAnimationFrame } from 'src/hooks/useAnimationFrame';
+import { useCallback, useState } from 'react';
+import { useAnimationFrame } from '../../hooks/useAnimationFrame';
 
 const gradientDegree = 90;
 
diff --git a/src/components/Text/index.tsx b/src/components/Text/index.tsx
index 2d976dca..b8706a98 100644
--- a/src/components/Text/index.tsx
+++ b/src/components/Text/index.tsx
@@ -1,6 +1,6 @@
 import { ElementType, Ref, forwardRef } from 'react';
 import { DEFAULT_ELEMENT, FontWeights, Typographys } from './types';
-import { OverridableProps } from 'types/OverridableProps';
+import { OverridableProps } from '../../types/OverridableProps';
 import classnames from 'classnames';
 
 interface TextBaseProps {
diff --git a/src/components/Tooltip/TooltipBody.tsx b/src/components/Tooltip/TooltipBody.tsx
index 1c92ce88..e0638745 100644
--- a/src/components/Tooltip/TooltipBody.tsx
+++ b/src/components/Tooltip/TooltipBody.tsx
@@ -1,7 +1,7 @@
 import { forwardRef, Ref } from 'react';
 import classnames from 'classnames';
 import Text from '../Text';
-import { CombineElementProps } from 'src/types/utils';
+import { CombineElementProps } from '../../types/utils';
 
 export type TooltipArrowDirection =
   | 'top-left'
diff --git a/src/components/Tooltip/index.tsx b/src/components/Tooltip/index.tsx
index c76b8297..968920dd 100644
--- a/src/components/Tooltip/index.tsx
+++ b/src/components/Tooltip/index.tsx
@@ -1,7 +1,7 @@
-import { cloneElement, ReactElement, useState, useMemo, useCallback } from 'react';
+import { Fragment, cloneElement, ReactElement, useState, useMemo, useCallback } from 'react';
 import { animated, useSpring } from 'react-spring';
-import { Portal } from 'src/contexts/Portal';
-import { CombineElementProps } from 'src/types/utils';
+import { Portal } from '../../contexts/Portal';
+import { CombineElementProps } from '../../types/utils';
 import TooltipBody from './TooltipBody';
 import { OffsetPosition, TooltipElementSize, TooltipPosition } from './types';
 import { getArrowDirection, getTooltipPosition } from './utils';
@@ -48,7 +48,7 @@ const Tooltip = ({ show, children, message, position = 'top-center', ...props }:
   });
 
   return (
-    <>
+    <Fragment>
       {cloneElement(children, {
         ref: childRef,
       })}
@@ -62,7 +62,7 @@ const Tooltip = ({ show, children, message, position = 'top-center', ...props }:
           </TooltipBody>
         </animated.div>
       </Portal>
-    </>
+    </Fragment>
   );
 };
 
diff --git a/src/components/Tooltip/utils.ts b/src/components/Tooltip/utils.ts
index 6c6b0007..9c7d2ecb 100644
--- a/src/components/Tooltip/utils.ts
+++ b/src/components/Tooltip/utils.ts
@@ -1,4 +1,4 @@
-import { getAbsoluteOffset } from 'utils/dom';
+import { getAbsoluteOffset } from '../../utils/dom';
 import { TooltipArrowDirection } from './TooltipBody';
 import { OffsetPosition, TooltipElementSize, TooltipPosition } from './types';
 
diff --git a/src/components/TransitionMotion/index.tsx b/src/components/TransitionMotion/index.tsx
index 055056e9..77bde724 100644
--- a/src/components/TransitionMotion/index.tsx
+++ b/src/components/TransitionMotion/index.tsx
@@ -1,6 +1,6 @@
-import { CSSProperties, ElementType, PropsWithChildren } from 'react';
+import { Fragment, CSSProperties, ElementType, PropsWithChildren } from 'react';
 import { TransitionKeyProps, useTransition, animated } from 'react-spring';
-import { OverridableProps } from 'src/types/OverridableProps';
+import { OverridableProps } from '../../types/OverridableProps';
 
 type Props<E extends ElementType = 'div'> = OverridableProps<
   E,
@@ -37,7 +37,7 @@ const TransitionMotion = ({
   const Component = animated[as ?? 'div'];
 
   return (
-    <>
+    <Fragment>
       {transitions.map(({ item, key, props }) => {
         return item ? (
           <Component key={key} {...rest} style={{ ...style, ...props }}>
@@ -45,7 +45,7 @@ const TransitionMotion = ({
           </Component>
         ) : null;
       })}
-    </>
+    </Fragment>
   );
 };
 
diff --git a/src/contexts/Overlay/OverlayContext.tsx b/src/contexts/Overlay/OverlayContext.tsx
index 29563ab0..104c37f2 100644
--- a/src/contexts/Overlay/OverlayContext.tsx
+++ b/src/contexts/Overlay/OverlayContext.tsx
@@ -8,7 +8,7 @@ import {
   useMemo,
 } from 'react';
 import { useContext } from 'react';
-import { Portal } from 'src';
+import { Portal } from '../Portal';
 
 interface OverlayValues {
   addToArea: (overlayId: string, element: ReactNode) => void;
diff --git a/src/contexts/Overlay/useOverlay.tsx b/src/contexts/Overlay/useOverlay.tsx
index c815573c..c6827d2e 100644
--- a/src/contexts/Overlay/useOverlay.tsx
+++ b/src/contexts/Overlay/useOverlay.tsx
@@ -1,7 +1,5 @@
-import { useCallback } from 'react';
-import { useRef } from 'react';
-import { useMemo } from 'react';
-import { generateID } from 'src/utils';
+import { useCallback, useRef, useMemo } from 'react';
+import { generateID } from '../../utils';
 import { useOverlayArea } from './OverlayContext';
 import StateReacter, { StateReacterControl } from './StateReacter';
 import { OverlayController } from './types';
diff --git a/src/hooks/useElementSize.ts b/src/hooks/useElementSize.ts
index 980ede13..0e96d536 100644
--- a/src/hooks/useElementSize.ts
+++ b/src/hooks/useElementSize.ts
@@ -11,7 +11,7 @@ const DEFAULT_CASE = {
   height: 0,
 };
 
-function useElementSize(ref: RefObject<HTMLElement>) {
+export function useElementSize(ref: RefObject<HTMLElement>) {
   return useMemo(() => {
     if (!ref.current) {
       return DEFAULT_CASE;
diff --git a/src/stories/Components/Accordion/index.stories.mdx b/src/stories/Components/Accordion/index.stories.mdx
index bb459c04..416ea794 100644
--- a/src/stories/Components/Accordion/index.stories.mdx
+++ b/src/stories/Components/Accordion/index.stories.mdx
@@ -1,4 +1,4 @@
-import { Accordion } from 'src';
+import Accordion from '../../../components/Accordion';
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
 
 <Meta title="Components/Accordion" components={Accordion} />
diff --git a/src/stories/Components/Grid/data.ts b/src/stories/Components/Grid/data.ts
index 2c45905b..ea7f7ee8 100644
--- a/src/stories/Components/Grid/data.ts
+++ b/src/stories/Components/Grid/data.ts
@@ -1,5 +1,5 @@
 import { CSSProperties } from 'react';
-import { colors } from 'src';
+import { colors } from '../../../constants/colors';
 
 export const columns = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12];
 export const columnStyle: CSSProperties = {
diff --git a/src/stories/Components/Grid/index.stories.mdx b/src/stories/Components/Grid/index.stories.mdx
index 77eceea9..d254643d 100644
--- a/src/stories/Components/Grid/index.stories.mdx
+++ b/src/stories/Components/Grid/index.stories.mdx
@@ -1,4 +1,6 @@
-import { Column, Row, Text, colors } from 'src';
+import { Column, Row } from '../../../components/Grid';
+import Text from '../../../components/Text';
+import { colors } from '../../../constants/colors';
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
 import { columns, columnStyle } from './data';
 
diff --git a/src/stories/Components/Icons/data.ts b/src/stories/Components/Icons/data.ts
index 91e2880f..8e8bf2cc 100644
--- a/src/stories/Components/Icons/data.ts
+++ b/src/stories/Components/Icons/data.ts
@@ -1,6 +1,6 @@
-import { colors } from 'src';
-import { IconName, LogoIconName } from 'src/types/icon';
-import { IconType } from 'src/components/Icon';
+import { colors } from '../../../constants/colors';
+import { IconName, LogoIconName } from '../../../types/icon';
+import { IconType } from '../../../components/Icon';
 
 export const commonIcons: IconName[] = [
   'accessibility',
diff --git a/src/stories/Components/Icons/index.stories.mdx b/src/stories/Components/Icons/index.stories.mdx
index 26c9a67d..4667f1eb 100644
--- a/src/stories/Components/Icons/index.stories.mdx
+++ b/src/stories/Components/Icons/index.stories.mdx
@@ -1,7 +1,8 @@
-import { Icon, Text, colors, Row, Column } from 'src';
-import { IconType } from 'src/components/Icon';
+import { Row, Column } from '../../../components/Grid';
+import Text from '../../../components/Text';
+import Icon, { IconType } from '../../../components/Icon';
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
-import { ColorProperty } from 'src/constants/colors';
+import { colors, ColorProperty } from '../../../constants/colors';
 import { Fragment } from 'react';
 
 <Meta title="Components/Icon" components={Icon} />
diff --git a/src/stories/Components/Modal/Components.tsx b/src/stories/Components/Modal/Components.tsx
index add4e27d..250ce40b 100644
--- a/src/stories/Components/Modal/Components.tsx
+++ b/src/stories/Components/Modal/Components.tsx
@@ -1,7 +1,7 @@
 import { useState } from 'react';
-import Button from 'components/Button';
+import Button from '../../../components/Button';
 import Modal, { ModalHeader, ModalContent, ModalFooter } from './Modal';
-import { Column } from 'src/components/Grid';
+import { Column } from '../../../components/Grid';
 import { useOverlayModal } from './useOverlayModal';
 
 interface FooterProps {
diff --git a/src/stories/Components/Modal/Modal/ModalContent.tsx b/src/stories/Components/Modal/Modal/ModalContent.tsx
index b89dd8a1..47a6366f 100644
--- a/src/stories/Components/Modal/Modal/ModalContent.tsx
+++ b/src/stories/Components/Modal/Modal/ModalContent.tsx
@@ -1,8 +1,8 @@
 import { ReactNode, isValidElement } from 'react';
 import classnames from 'classnames';
-import Text from 'components/Text';
-import { Typographys } from 'components/Text/types';
-import { CombineElementProps } from 'types/utils';
+import Text from '../../../../components/Text';
+import { Typographys } from '../../../../components/Text/types';
+import { CombineElementProps } from '../../../../types/utils';
 
 type ModalContentProps = CombineElementProps<
   'div',
diff --git a/src/stories/Components/Modal/Modal/ModalFooter.tsx b/src/stories/Components/Modal/Modal/ModalFooter.tsx
index 0cfae77a..c6e0f836 100644
--- a/src/stories/Components/Modal/Modal/ModalFooter.tsx
+++ b/src/stories/Components/Modal/Modal/ModalFooter.tsx
@@ -1,5 +1,5 @@
 import { ReactNode } from 'react';
-import { CombineElementProps } from 'src/types/utils';
+import { CombineElementProps } from '../../../../types/utils';
 import classnames from 'classnames';
 
 type ModalFooterProps = CombineElementProps<
diff --git a/src/stories/Components/Modal/Modal/ModalHeader.tsx b/src/stories/Components/Modal/Modal/ModalHeader.tsx
index 1ad8999a..b1592ecd 100644
--- a/src/stories/Components/Modal/Modal/ModalHeader.tsx
+++ b/src/stories/Components/Modal/Modal/ModalHeader.tsx
@@ -1,7 +1,7 @@
 import { ReactNode, isValidElement } from 'react';
-import Text from 'components/Text';
-import { Typographys } from 'components/Text/types';
-import { CombineElementProps } from 'src/types/utils';
+import Text from '../../../../components/Text';
+import { Typographys } from '../../../../components/Text/types';
+import { CombineElementProps } from '../../../../types/utils';
 import classnames from 'classnames';
 
 type ModalHeaderProps = CombineElementProps<
diff --git a/src/stories/Components/Modal/Modal/ModalWindow.tsx b/src/stories/Components/Modal/Modal/ModalWindow.tsx
index 7e7b0e2f..b4a08895 100644
--- a/src/stories/Components/Modal/Modal/ModalWindow.tsx
+++ b/src/stories/Components/Modal/Modal/ModalWindow.tsx
@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import classnames from 'classnames';
-import { CombineElementProps } from 'src/types/utils';
+import { CombineElementProps } from '../../../../types/utils';
 
 type ModalWindowProps = CombineElementProps<
   'div',
diff --git a/src/stories/Components/Modal/Modal/index.tsx b/src/stories/Components/Modal/Modal/index.tsx
index 8f98ac82..ea5348f4 100644
--- a/src/stories/Components/Modal/Modal/index.tsx
+++ b/src/stories/Components/Modal/Modal/index.tsx
@@ -1,9 +1,9 @@
 import React, { ReactElement, cloneElement, useRef, useCallback, useEffect, Children } from 'react';
 import ModalBackdrop from './ModalBackdrop';
 import ModalWindow from './ModalWindow';
-import { generateID } from 'utils/index';
-import { CombineElementProps } from 'src/types/utils';
-import { TransitionMotion } from 'src';
+import { generateID } from '../../../../utils/index';
+import { CombineElementProps } from '../../../../types/utils';
+import TransitionMotion from '../../../../components/TransitionMotion';
 
 export type ModalProps = CombineElementProps<
   'div',
diff --git a/src/stories/Components/Modal/useOverlayModal.tsx b/src/stories/Components/Modal/useOverlayModal.tsx
index 6f1c57ae..1ad1f0e0 100644
--- a/src/stories/Components/Modal/useOverlayModal.tsx
+++ b/src/stories/Components/Modal/useOverlayModal.tsx
@@ -1,5 +1,5 @@
 import { useEffect } from 'react';
-import { useOverlay } from 'src';
+import { useOverlay } from '../../../contexts/Overlay';
 import Modal, { ModalContent } from './Modal';
 
 export function useOverlayModal() {
diff --git a/src/stories/Components/ProgressBar/Components.tsx b/src/stories/Components/ProgressBar/Components.tsx
index e262ea75..d5113ead 100644
--- a/src/stories/Components/ProgressBar/Components.tsx
+++ b/src/stories/Components/ProgressBar/Components.tsx
@@ -1,5 +1,5 @@
-import { useEffect, useState } from 'react';
-import { Text } from 'src';
+import { useEffect, useState, Fragment } from 'react';
+import Text from '../../../components/Text';
 import { MAX_VALUE, labelPosition } from './data';
 import ProgressBar from './ProgressBar';
 
@@ -57,7 +57,7 @@ export const LabelFormatter = () => {
   }, []);
 
   return (
-    <>
+    <Fragment>
       <ProgressBar
         min={0}
         style={{ marginBottom: 16 }}
@@ -84,6 +84,6 @@ export const LabelFormatter = () => {
         showLabel={true}
         labelFormatter={(value) => `${Math.floor((value / MAX_VALUE) * 100)}%`}
       />
-    </>
+    </Fragment>
   );
 };
diff --git a/src/stories/Components/ProgressBar/ProgressBar.tsx b/src/stories/Components/ProgressBar/ProgressBar.tsx
index fa187541..23ffb5a9 100644
--- a/src/stories/Components/ProgressBar/ProgressBar.tsx
+++ b/src/stories/Components/ProgressBar/ProgressBar.tsx
@@ -1,8 +1,8 @@
 import { forwardRef } from 'react';
 import classnames from 'classnames';
-import { CombineElementProps } from 'src/types/utils';
-import { Text } from 'src';
-import useProgress from 'src/hooks/useProgress';
+import { CombineElementProps } from '../../../types/utils';
+import Text from '../../../components/Text';
+import useProgress from '../../../hooks/useProgress';
 
 const noop = (value: number) => value;
 
diff --git a/src/stories/Components/Skeleton/index.stories.mdx b/src/stories/Components/Skeleton/index.stories.mdx
index d6d7f13c..0621fc5d 100644
--- a/src/stories/Components/Skeleton/index.stories.mdx
+++ b/src/stories/Components/Skeleton/index.stories.mdx
@@ -1,4 +1,5 @@
-import { Skeleton, Spacing } from 'src';
+import Skeleton from '../../../components/Skeleton';
+import Spacing from '../../../components/Spacing';
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
 
 <Meta title="components/Skeleton" components={Skeleton} />
diff --git a/src/stories/Components/Test/index.stories.mdx b/src/stories/Components/Test/index.stories.mdx
index a1d8c7cc..3468fa4b 100644
--- a/src/stories/Components/Test/index.stories.mdx
+++ b/src/stories/Components/Test/index.stories.mdx
@@ -1,5 +1,4 @@
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
-import { Test } from 'src';
 import Button from './Button';
 
 <Meta title="Components/Test" components={Test} />
diff --git a/src/stories/Components/Text/index.stories.mdx b/src/stories/Components/Text/index.stories.mdx
index 0f4a1c17..11cfe622 100644
--- a/src/stories/Components/Text/index.stories.mdx
+++ b/src/stories/Components/Text/index.stories.mdx
@@ -1,4 +1,4 @@
-import { Text } from 'src';
+import Text from '../../../components/Text';
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
 
 <Meta title="components/Text" components={Text} />
diff --git a/src/stories/Components/Tooltip/Components.tsx b/src/stories/Components/Tooltip/Components.tsx
index bd10f066..695ffd84 100644
--- a/src/stories/Components/Tooltip/Components.tsx
+++ b/src/stories/Components/Tooltip/Components.tsx
@@ -1,6 +1,7 @@
 import { useState } from 'react';
-import { Tooltip, Button } from 'src';
-import { TooltipPosition } from 'src/components/Tooltip/types';
+import Tooltip from '../../../components/Tooltip';
+import Button from '../../../components/Button';
+import { TooltipPosition } from '../../../components/Tooltip/types';
 import { positions } from './data';
 
 const TooltipButton = ({ children }: { children: TooltipPosition }) => {
diff --git a/src/stories/Components/Tooltip/data.ts b/src/stories/Components/Tooltip/data.ts
index 657a6f75..6f912566 100644
--- a/src/stories/Components/Tooltip/data.ts
+++ b/src/stories/Components/Tooltip/data.ts
@@ -1,4 +1,4 @@
-import { TooltipPosition } from 'src/components/Tooltip/types';
+import { TooltipPosition } from '../../../components/Tooltip/types';
 
 export const positions: TooltipPosition[] = [
   'top-left',
diff --git a/src/stories/Components/Tooltip/index.stories.mdx b/src/stories/Components/Tooltip/index.stories.mdx
index 30084d8c..6d17194b 100644
--- a/src/stories/Components/Tooltip/index.stories.mdx
+++ b/src/stories/Components/Tooltip/index.stories.mdx
@@ -1,4 +1,4 @@
-import { Tooltip } from 'src';
+import Tooltip from '../../../components/Tooltip';
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
 import { Preview, Positions, AbsolutePositionTest } from './Components';
 
diff --git a/src/stories/Styles/Colors/data.ts b/src/stories/Styles/Colors/data.ts
index 2ab204fe..68269a53 100644
--- a/src/stories/Styles/Colors/data.ts
+++ b/src/stories/Styles/Colors/data.ts
@@ -1,4 +1,4 @@
-import { ColorProperty, SemanticColor } from 'src/constants/colors';
+import { ColorProperty, SemanticColor } from '../../../constants/colors';
 
 export const grayScaleNames = [
   'gray100',
diff --git a/src/stories/Styles/Colors/index.stories.mdx b/src/stories/Styles/Colors/index.stories.mdx
index 36046828..6fccfce4 100644
--- a/src/stories/Styles/Colors/index.stories.mdx
+++ b/src/stories/Styles/Colors/index.stories.mdx
@@ -1,6 +1,6 @@
 import { Meta, Story } from '@storybook/addon-docs/blocks';
-import { colors, Text } from 'src';
-import { ColorProperty, SemanticColor } from 'src/constants/colors';
+import Text from '../../../components/Text';
+import { colors, ColorProperty, SemanticColor } from '../../../constants/colors';
 import { grayScaleNames, semanticColorNames, indexMap } from './data';
 
 <Meta title="Styles/Colors" />
diff --git a/src/stories/Styles/Shadows/index.stories.mdx b/src/stories/Styles/Shadows/index.stories.mdx
index 7060ea70..a664027c 100644
--- a/src/stories/Styles/Shadows/index.stories.mdx
+++ b/src/stories/Styles/Shadows/index.stories.mdx
@@ -1,6 +1,8 @@
 import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
 import classnames from 'classnames';
-import { Text, Shadow, Spacing } from 'src';
+import Text from '../../../components/Text';
+import Shadow from '../../../components/Shadow';
+import Spacing from '../../../components/Spacing';
 import { Box } from './components';
 
 <Meta title="Styles/Shadows" />
diff --git a/src/stories/Styles/Typography/data.ts b/src/stories/Styles/Typography/data.ts
index c4e7cc57..210b2a42 100644
--- a/src/stories/Styles/Typography/data.ts
+++ b/src/stories/Styles/Typography/data.ts
@@ -1,4 +1,4 @@
-import { Typographys, FontWeights } from 'components/Text/types';
+import { Typographys, FontWeights } from '../../../components/Text/types';
 
 export const typographyNames: { [key in Typographys]: string } = {
   h1: '머릿말 1',
diff --git a/src/stories/Styles/Typography/index.stories.mdx b/src/stories/Styles/Typography/index.stories.mdx
index 84baffe9..09baea16 100644
--- a/src/stories/Styles/Typography/index.stories.mdx
+++ b/src/stories/Styles/Typography/index.stories.mdx
@@ -1,6 +1,6 @@
-import { Text } from 'src';
+import Text from '../../../components/Text';
+import { typographys, Typographys, FontWeights, fontWeights } from '../../../components/Text/types';
 import { Meta, Story } from '@storybook/addon-docs/blocks';
-import { typographys, Typographys, FontWeights, fontWeights } from 'components/Text/types';
 import { typographyNames, fontWeightNames } from './data';
 
 <Meta title="Styles/Typography" components={Text} />
diff --git a/tsconfig.build.json b/tsconfig.build.json
deleted file mode 100644
index d8ddbb12..00000000
--- a/tsconfig.build.json
+++ /dev/null
@@ -1,10 +0,0 @@
-{
-  "extends": "./tsconfig.json",
-  "compilerOptions": {
-    "declarationDir": "./dist"
-  },
-  "include": ["./src/**/*"],
-  "exclude": [
-    "./node_modules",
-  ]
-}
diff --git a/tsconfig.common.json b/tsconfig.common.json
index 25078f96..ebe51a55 100644
--- a/tsconfig.common.json
+++ b/tsconfig.common.json
@@ -1,10 +1,16 @@
 {
+  "include": ["./src/**/*"],
+  "exclude": [
+    "./node_modules",
+    "./legacy"
+  ],
   "compilerOptions": {
     "target": "es2019",
     "module": "ESNext",
     "lib": ["dom", "dom.iterable", "esnext"],
     "jsx": "react-jsx",
     "moduleResolution": "node",
+    "declarationDir": "./dist",
     "declaration": true,
     "forceConsistentCasingInFileNames": true,
     "noImplicitReturns": true,
diff --git a/yarn.lock b/yarn.lock
index d9ae307c..af9067e9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -2511,7 +2511,7 @@ __metadata:
     rollup-plugin-typescript2: ^0.29.0
     sass: ^1.29.0
     semantic-release: ^17.2.4
-    tsconfig-paths-webpack-plugin: ^3.3.0
+    tsconfig-paths-webpack-plugin: ^3.5.1
     typescript: ^4.0.3
     webpack-hot-middleware: ^2.25.0
   languageName: unknown
@@ -22884,7 +22884,7 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"tsconfig-paths-webpack-plugin@npm:^3.3.0":
+"tsconfig-paths-webpack-plugin@npm:^3.5.1":
   version: 3.5.1
   resolution: "tsconfig-paths-webpack-plugin@npm:3.5.1"
   dependencies: