Folder and aliases refactor

snowpack.config.js

@@ -22,12 +22,7 @@ module.exports = {
     open: "none",
   },
   alias: {
-    "@assets": "./src/assets",
-    "@utils": "./src/utils",
-    "@type": "./src/type",
+    "~": "./src",
   },
   exclude: ["**/node_modules/**/*", "**/*.test.*"],
-  env: {
-    // API_URL: "https://publitebackend.dmitriy.icu",
-  },
 };

src/App/index.tsx

@@ -1,10 +1,11 @@
-import { Route } from "@type/router";
+import { Route } from "~/types/router";
 import React from "react";
 
-import { Bookshelf } from "../Bookshelf";
-import { Router } from "../router";
-import { Err404 } from "../router/404";
-import { UploadForm } from "../UploadForm";
+import { Bookshelf } from "~/pages/Bookshelf";
+import { UploadForm } from "~/pages/UploadForm";
+
+import { Router } from "~/router";
+import { Err404 } from "~/router/404";
 
 import styles from "./App.module.css";
 

src/api.ts

@@ -1,4 +1,4 @@
-import { IBook, optionalBookProps, requiredBookProps } from "@type/book";
+import { IBook, optionalBookProps, requiredBookProps } from "~/types/book";
 
 import { API_URL } from "./constants";
 

src/index.tsx

@@ -3,7 +3,7 @@ import ReactDOM from "react-dom";
 
 import "./index.css";
 
-import { App } from "./App";
+import { App } from "~/App";
 
 ReactDOM.render(
   <React.StrictMode>

src/pages/Bookshelf/AddBook/index.tsx

@@ -1,9 +1,9 @@
 import React from "react";
 
-import plusIcon from "@assets/plus.svg";
+import plusIcon from "~/assets/plus.svg";
 import styles from "./AddBook.module.css";
-import { BASE_URL } from "../../constants";
-import { goTo } from "../../router/goTo";
+import { BASE_URL } from "~/constants";
+import { goTo } from "~/router/goTo";
 
 export const AddBook = () => {
   return (

src/pages/Bookshelf/BookItem/index.tsx

@@ -2,7 +2,7 @@ import React from "react";
 
 import styles from "./BookItem.module.css";
 
-import { IBook } from "@type/book";
+import { IBook } from "~/types/book";
 
 interface IBookItemProps extends IBook {}
 

src/pages/Bookshelf/index.tsx

@@ -1,11 +1,11 @@
 import React, { useEffect, useState } from "react";
-import { IBook } from "@type/book";
+import { IBook } from "~/types/book";
 
 import styles from "./Bookshelf.module.css";
 
 import { BookItem } from "./BookItem";
 import { AddBook } from "./AddBook";
-import { readBooks } from "@utils/localStorage";
+import { readBooks } from "~/utils/localStorage";
 
 export const Bookshelf = () => {
   const [books, setBooks] = useState<IBook[]>([]);

src/pages/UploadForm/index.tsx

@@ -1,11 +1,11 @@
 import React, { useState } from "react";
 
-import plusIcon from "@assets/plus.svg";
+import plusIcon from "~/assets/plus.svg";
 import styles from "./UploadForm.module.css";
-import { submitFile, validateResponse, validState } from "../api";
-import { saveBook } from "@utils/localStorage";
-import { BASE_URL } from "../constants";
-import { goTo } from "../router/goTo";
+import { submitFile, validateResponse, validState } from "~/api";
+import { saveBook } from "~/utils/localStorage";
+import { BASE_URL } from "~/constants";
+import { goTo } from "~/router/goTo";
 
 export const UploadForm = () => {
   const [error, setError] = useState("");

src/router/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
-import { BASE_URL } from "../constants";
-import { Route } from "@type/router";
+import { BASE_URL } from "~/constants";
+import { Route } from "~/types/router";
 import { Err404 } from "./404";
 import { goTo } from "./goTo";
 

src/utils/localStorage.ts

@@ -1,7 +1,7 @@
-import { IBook } from "@type/book";
-import { isArrOfStr } from "@type/utils";
-import { validateResponse } from "../api";
-import { BookItem } from "../Bookshelf/BookItem";
+import { IBook } from "~/types/book";
+import { isArrOfStr } from "~/types/utils";
+import { validateResponse } from "~/api";
+import { BookItem } from "~/pages/Bookshelf/BookItem";
 
 const readBookList = <T>(
   cb: (bookList: string[]) => T,

tsconfig.json

@@ -11,9 +11,7 @@
     "moduleResolution": "node",
     "resolveJsonModule": true,
     "paths": {
-      "@assets/*": ["./src/assets/*"],
-      "@utils/*": ["./src/utils/*"],
-      "@type/*": ["./src/type/*"]
+      "~/*": ["./src/*"]
     }
   }
 }