Refactor: ts path alias, prettier singleQuote 적용

Author: gitgitWi

.editorconfig

@@ -18,4 +18,3 @@ insert_final_newline = ignore
 
 [*.md]
 trim_trailing_whitespace = false
-

.eslintrc.js

@@ -6,25 +6,25 @@ module.exports = {
     es2021: true,
   },
   extends: [
-    "eslint:recommended",
-    "plugin:react/recommended",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:prettier/recommended",
+    'eslint:recommended',
+    'plugin:react/recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:prettier/recommended',
   ],
-  parser: "@typescript-eslint/parser",
+  parser: '@typescript-eslint/parser',
   parserOptions: {
     ecmaFeatures: {
       jsx: true,
     },
     ecmaVersion: 12,
-    sourceType: "module",
+    sourceType: 'module',
   },
-  plugins: ["react", "@typescript-eslint", "prettier"],
+  plugins: ['react', '@typescript-eslint', 'prettier'],
   rules: {
-    "react/jsx-uses-react": "off",
-    "react/react-in-jsx-scope": "off",
-    "react/prop-types": "off",
-    "react/require-default-props": "off",
-    "@typescript-eslint/explicit-module-boundary-types": "off",
+    'react/jsx-uses-react': 'off',
+    'react/react-in-jsx-scope': 'off',
+    'react/prop-types': 'off',
+    'react/require-default-props': 'off',
+    '@typescript-eslint/explicit-module-boundary-types': 'off',
   },
 };

.github/workflows/deploy.yml

@@ -22,14 +22,16 @@ jobs:
         uses: actions/setup-node@v2
         with:
           node-version: ${{ matrix.node-version }}
-          cache: "yarn"
+          cache: 'yarn'
 
       - name: Install Packages
         run: yarn install --frozen-lockfile
 
       - name: Build 🔧
         run: yarn build
+
       - run: yarn run export
+
       - run: touch ./out/.nojekyll
 
       - name: Deploy

.prettierrc

@@ -3,5 +3,6 @@
   "useTabs": false,
   "endOfLine": "lf",
   "printWidth": 90,
-  "trailingComma": "es5"
+  "trailingComma": "es5",
+  "singleQuote": true
 }

.vscode/settings.json

@@ -1,5 +1,10 @@
 {
   "editor.tabSize": 2,
   "prettier.printWidth": 90,
-  "prettier.endOfLine": "lf"
+  "prettier.endOfLine": "lf",
+  "prettier.singleQuote": true,
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "cSpell.words": ["gitgitWi"]
 }

components/molecules/TitleTexts.tsx

@@ -1,11 +1,12 @@
-import { Texts } from "../atoms/Texts";
-import { CENTER } from "../../styles/GlobalClassNames";
-import style from "./TitleTexts.module.scss";
+import { Texts } from '@/components/atoms/Texts';
+import { CENTER } from '@/styles/GlobalClassNames';
+
+import style from './TitleTexts.module.scss';
 
 interface TitleTextsProps {
   titleText: string;
 }
 
 export function TitleTexts({ titleText }: TitleTextsProps) {
-  return <Texts texts={titleText} className={[style.headText, CENTER].join(" ")} />;
+  return <Texts texts={titleText} className={[style.headText, CENTER].join(' ')} />;
 }

components/molecules/index.ts

@@ -1 +1 @@
-export { TitleTexts } from "./TitleTexts";
+export { TitleTexts } from './TitleTexts';

constants/index.ts

@@ -1 +1 @@
-export * from "./texts";
+export * from './texts';

pages/_app.tsx

@@ -1,5 +1,5 @@
-import { AppProps } from "next/app";
-import "../styles/globals.scss";
+import { AppProps } from 'next/app';
+import '@/styles/globals.scss';
 
 export default function MyApp({ Component, pageProps }: AppProps) {
   return <Component {...pageProps} />;

pages/index.tsx

@@ -1,6 +1,6 @@
-import Head from "next/head";
-import { MAIN_META_DESC, MAIN_TITLE } from "../constants";
-import { TitleTexts } from "../components/molecules";
+import Head from 'next/head';
+import { MAIN_META_DESC, MAIN_TITLE } from '@/constants/index';
+import { TitleTexts } from '@/components/molecules';
 
 export default function Home() {
   return (