diff --git a/.eslintrc.js b/.eslintrc.js
index aca53dc6bb..01389e3ed5 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -30,6 +30,8 @@ module.exports = {
                 'no-plusplus': ['error', { allowForLoopAfterthoughts: true }],
 
                 // just why
+                "react/jsx-uses-react": "off",
+                "react/react-in-jsx-scope": "off",
                 'react/jsx-no-bind': 'off',
                 'react/jsx-props-no-spreading': 'off',
                 'react/require-default-props': 'off',
diff --git a/src/components/ExtensionCard.tsx b/src/components/ExtensionCard.tsx
index 0941014f36..d386d82e5b 100644
--- a/src/components/ExtensionCard.tsx
+++ b/src/components/ExtensionCard.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useState } from 'react';
+import { useState } from 'react';
 import Card from '@mui/material/Card';
 import CardContent from '@mui/material/CardContent';
 import Button from '@mui/material/Button';
diff --git a/src/components/MangaCard.tsx b/src/components/MangaCard.tsx
index 9fa2052ae2..15c9d45fe6 100644
--- a/src/components/MangaCard.tsx
+++ b/src/components/MangaCard.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import Card from '@mui/material/Card';
 import CardActionArea from '@mui/material/CardActionArea';
 import Typography from '@mui/material/Typography';
diff --git a/src/components/atoms/SortRadioInput.tsx b/src/components/atoms/SortRadioInput.tsx
index d4cb81150d..a36a8704e2 100644
--- a/src/components/atoms/SortRadioInput.tsx
+++ b/src/components/atoms/SortRadioInput.tsx
@@ -8,14 +8,14 @@
 
 import ArrowDownward from '@mui/icons-material/ArrowDownward';
 import ArrowUpward from '@mui/icons-material/ArrowUpward';
-import React from 'react';
+import { memo } from 'react';
 import RadioInput, { RadioInputProps } from '@/components/atoms/RadioInput';
 
 interface IProps extends RadioInputProps {
     sortDescending?: boolean | null | undefined;
 }
 
-const SortRadioInput = React.memo(({ sortDescending, ...rest }: IProps) => (
+const SortRadioInput = memo(({ sortDescending, ...rest }: IProps) => (
     <RadioInput
         checkedIcon={sortDescending ? <ArrowDownward color="primary" /> : <ArrowUpward color="primary" />}
         {...rest}
diff --git a/src/components/library/UpdateChecker.tsx b/src/components/library/UpdateChecker.tsx
index 17cfadd39d..be55deb741 100644
--- a/src/components/library/UpdateChecker.tsx
+++ b/src/components/library/UpdateChecker.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import IconButton from '@mui/material/IconButton';
 import RefreshIcon from '@mui/icons-material/Refresh';
 import CircularProgress from '@mui/material/CircularProgress';
diff --git a/src/components/manga/ResumeFAB.tsx b/src/components/manga/ResumeFAB.tsx
index a84680660d..5c43c5d50f 100644
--- a/src/components/manga/ResumeFAB.tsx
+++ b/src/components/manga/ResumeFAB.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import { Link } from 'react-router-dom';
 import { PlayArrow } from '@mui/icons-material';
 import { useTranslation } from 'react-i18next';
diff --git a/src/components/navbar/ReaderNavBar.tsx b/src/components/navbar/ReaderNavBar.tsx
index e1d69c422b..d1423d4dde 100644
--- a/src/components/navbar/ReaderNavBar.tsx
+++ b/src/components/navbar/ReaderNavBar.tsx
@@ -12,7 +12,7 @@ import KeyboardArrowLeftIcon from '@mui/icons-material/KeyboardArrowLeft';
 import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
 import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown';
 import KeyboardArrowUpIcon from '@mui/icons-material/KeyboardArrowUp';
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import Typography from '@mui/material/Typography';
 import { useLocation, useNavigate } from 'react-router-dom';
 import Slide from '@mui/material/Slide';
diff --git a/src/components/navbar/navigation/DesktopSideBar.tsx b/src/components/navbar/navigation/DesktopSideBar.tsx
index 1711c403a9..f0f03429e3 100644
--- a/src/components/navbar/navigation/DesktopSideBar.tsx
+++ b/src/components/navbar/navigation/DesktopSideBar.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import { ListItemIcon, Tooltip, styled, ListItemButton } from '@mui/material';
 import { Link, useLocation } from 'react-router-dom';
 import { useTheme } from '@mui/material/styles';
diff --git a/src/components/navbar/navigation/MobileBottomBar.tsx b/src/components/navbar/navigation/MobileBottomBar.tsx
index 823d67a55f..ad89e6863d 100644
--- a/src/components/navbar/navigation/MobileBottomBar.tsx
+++ b/src/components/navbar/navigation/MobileBottomBar.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import { styled, Box, ListItemButton } from '@mui/material';
 import { Link as RRDLink, useLocation } from 'react-router-dom';
 import { useTheme } from '@mui/material/styles';
diff --git a/src/components/reader/DoublePage.tsx b/src/components/reader/DoublePage.tsx
index 188c5ce92d..5565abcab2 100644
--- a/src/components/reader/DoublePage.tsx
+++ b/src/components/reader/DoublePage.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
+import { forwardRef } from 'react';
 import { Box, styled } from '@mui/material';
 import { IReaderSettings } from '@/typings';
 
@@ -26,7 +26,7 @@ interface IProps {
     settings: IReaderSettings;
 }
 
-const DoublePage = React.forwardRef((props: IProps, ref: any) => {
+const DoublePage = forwardRef((props: IProps, ref: any) => {
     const { image1src, image2src, index, settings } = props;
 
     return (
diff --git a/src/components/reader/Page.tsx b/src/components/reader/Page.tsx
index 772af3470a..71cca78564 100644
--- a/src/components/reader/Page.tsx
+++ b/src/components/reader/Page.tsx
@@ -6,17 +6,17 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useRef } from 'react';
+import { useState, useEffect, forwardRef, useRef } from 'react';
 import Box from '@mui/material/Box';
 import { IReaderSettings } from '@/typings';
 import SpinnerImage from '@/components/util/SpinnerImage';
 
 function imageStyle(settings: IReaderSettings): any {
-    const [dimensions, setDimensions] = React.useState({
+    const [dimensions, setDimensions] = useState({
         height: window.innerHeight,
         width: window.innerWidth,
     });
-    React.useEffect(() => {
+    useEffect(() => {
         function handleResize() {
             setDimensions({
                 height: window.innerHeight,
@@ -65,7 +65,7 @@ interface IProps {
     settings: IReaderSettings;
 }
 
-const Page = React.forwardRef((props: IProps, ref: any) => {
+const Page = forwardRef((props: IProps, ref: any) => {
     const { src, index, onImageLoad, settings } = props;
 
     const imgRef = useRef<HTMLImageElement>(null);
diff --git a/src/components/reader/PageNumber.tsx b/src/components/reader/PageNumber.tsx
index 9457927ed0..fa03afa2c6 100644
--- a/src/components/reader/PageNumber.tsx
+++ b/src/components/reader/PageNumber.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import { Box } from '@mui/material';
 import { IReaderSettings } from '@/typings';
 
diff --git a/src/components/reader/ReaderSettingsOptions.tsx b/src/components/reader/ReaderSettingsOptions.tsx
index e20c711595..0af242f9c8 100644
--- a/src/components/reader/ReaderSettingsOptions.tsx
+++ b/src/components/reader/ReaderSettingsOptions.tsx
@@ -10,7 +10,6 @@ import { List, ListItem, ListItemText, Switch } from '@mui/material';
 import ListItemSecondaryAction from '@mui/material/ListItemSecondaryAction';
 import Select from '@mui/material/Select';
 import MenuItem from '@mui/material/MenuItem';
-import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { IReaderSettings } from '@/typings';
 
diff --git a/src/components/reader/pager/DoublePagedPager.tsx b/src/components/reader/pager/DoublePagedPager.tsx
index 89bd010641..e147e96c72 100644
--- a/src/components/reader/pager/DoublePagedPager.tsx
+++ b/src/components/reader/pager/DoublePagedPager.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useEffect, useRef } from 'react';
+import { useEffect, useRef } from 'react';
 import { Box } from '@mui/material';
 import { createRoot } from 'react-dom/client';
 import { IReaderProps } from '@/typings';
diff --git a/src/components/reader/pager/HorizontalPager.tsx b/src/components/reader/pager/HorizontalPager.tsx
index e7387afaa5..161e81733c 100644
--- a/src/components/reader/pager/HorizontalPager.tsx
+++ b/src/components/reader/pager/HorizontalPager.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useEffect, useRef } from 'react';
+import { useEffect, useRef } from 'react';
 import { Box } from '@mui/material';
 import { IReaderProps } from '@/typings';
 import Page from '@/components/reader/Page';
diff --git a/src/components/reader/pager/PagedPager.tsx b/src/components/reader/pager/PagedPager.tsx
index 06a715c07f..e12c0e8c09 100644
--- a/src/components/reader/pager/PagedPager.tsx
+++ b/src/components/reader/pager/PagedPager.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useEffect, useRef } from 'react';
+import { useEffect, useRef } from 'react';
 import { Box } from '@mui/material';
 import { IReaderProps } from '@/typings';
 import Page from '@/components/reader/Page';
diff --git a/src/components/reader/pager/VerticalPager.tsx b/src/components/reader/pager/VerticalPager.tsx
index b231eac7f1..e5f01e2837 100644
--- a/src/components/reader/pager/VerticalPager.tsx
+++ b/src/components/reader/pager/VerticalPager.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useCallback, useEffect, useRef } from 'react';
+import { useCallback, useEffect, useRef } from 'react';
 import { Box } from '@mui/material';
 import { IReaderProps } from '@/typings';
 import Page from '@/components/reader/Page';
diff --git a/src/components/source/SourceMangaGrid.tsx b/src/components/source/SourceMangaGrid.tsx
index 194205a9b3..2b4f7b3657 100644
--- a/src/components/source/SourceMangaGrid.tsx
+++ b/src/components/source/SourceMangaGrid.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { IMangaCard } from '@/typings';
 import MangaGrid, { IMangaGridProps } from '@/components/MangaGrid';
diff --git a/src/components/source/SourceOptions.tsx b/src/components/source/SourceOptions.tsx
index 1663d23c54..ec462b68ad 100644
--- a/src/components/source/SourceOptions.tsx
+++ b/src/components/source/SourceOptions.tsx
@@ -8,7 +8,7 @@
 
 import FilterListIcon from '@mui/icons-material/FilterList';
 import { Button, Stack, Box } from '@mui/material';
-import React from 'react';
+import { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { ISourceFilters, IState } from '@/typings';
 import OptionsPanel from '@/components/molecules/OptionsPanel';
@@ -143,7 +143,7 @@ export default function SourceOptions({
     update,
 }: IFilters1) {
     const { t } = useTranslation();
-    const [FilterOptions, setFilterOptions] = React.useState(false);
+    const [FilterOptions, setFilterOptions] = useState(false);
 
     function handleReset() {
         resetFilterValue(0);
diff --git a/src/components/sourceConfiguration/EditTextPreference.tsx b/src/components/sourceConfiguration/EditTextPreference.tsx
index dacf075a8b..45a58e8d35 100644
--- a/src/components/sourceConfiguration/EditTextPreference.tsx
+++ b/src/components/sourceConfiguration/EditTextPreference.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useState } from 'react';
+import { useState } from 'react';
 import ListItemText from '@mui/material/ListItemText';
 import Dialog from '@mui/material/Dialog';
 import DialogTitle from '@mui/material/DialogTitle';
diff --git a/src/components/sourceConfiguration/TwoStatePreference.tsx b/src/components/sourceConfiguration/TwoStatePreference.tsx
index 218c61a965..2c6dd5a0af 100644
--- a/src/components/sourceConfiguration/TwoStatePreference.tsx
+++ b/src/components/sourceConfiguration/TwoStatePreference.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useState, useEffect } from 'react';
+import { createElement, useState, useEffect } from 'react';
 import ListItem from '@mui/material/ListItem';
 import ListItemText from '@mui/material/ListItemText';
 import ListItemSecondaryAction from '@mui/material/ListItemSecondaryAction';
@@ -33,7 +33,7 @@ function TwoSatePreference(props: TwoStatePreferenceProps) {
         <ListItem>
             <ListItemText primary={title} secondary={summary} />
             <ListItemSecondaryAction>
-                {React.createElement(getTwoStateType(type), {
+                {createElement(getTwoStateType(type), {
                     edge: 'end',
                     checked: internalCurrentValue,
                     onChange: () => {
diff --git a/src/components/util/CustomExtensionOutlinedIcon.tsx b/src/components/util/CustomExtensionOutlinedIcon.tsx
index 575ea7d21c..b7f0cba4c4 100644
--- a/src/components/util/CustomExtensionOutlinedIcon.tsx
+++ b/src/components/util/CustomExtensionOutlinedIcon.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import createSvgIcon from '@mui/material/utils/createSvgIcon';
 
 const d =
diff --git a/src/components/util/EmptyView.tsx b/src/components/util/EmptyView.tsx
index aa5918587c..d2a9ad95ef 100644
--- a/src/components/util/EmptyView.tsx
+++ b/src/components/util/EmptyView.tsx
@@ -8,7 +8,7 @@
 
 // adopted from: https://github.com/tachiyomiorg/tachiyomi/blob/master/app/src/main/java/eu/kanade/tachiyomi/widget/EmptyView.kt
 
-import React, { useMemo } from 'react';
+import { useMemo } from 'react';
 import Typography from '@mui/material/Typography';
 import { useTheme } from '@mui/material/styles';
 import { Box, useMediaQuery } from '@mui/material';
diff --git a/src/components/util/ListItemLink.tsx b/src/components/util/ListItemLink.tsx
index 0733e3a77f..795aa8432f 100644
--- a/src/components/util/ListItemLink.tsx
+++ b/src/components/util/ListItemLink.tsx
@@ -6,7 +6,6 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
 import { Link } from 'react-router-dom';
 import { ListItemButton, ListItemButtonProps } from '@mui/material';
 
diff --git a/src/index.tsx b/src/index.tsx
index 1566fc0836..bc62fa10dd 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React from 'react';
+import { StrictMode } from 'react';
 import { createRoot } from 'react-dom/client';
 import App from '@/App';
 import '@/index.css';
@@ -16,7 +16,7 @@ import '@fontsource/roboto';
 const container = document.getElementById('root');
 const root = createRoot(container!);
 root.render(
-    <React.StrictMode>
+    <StrictMode>
         <App />
-    </React.StrictMode>,
+    </StrictMode>,
 );
diff --git a/src/lib/StrictModeDroppable.tsx b/src/lib/StrictModeDroppable.tsx
index e594820faa..8e675c88e1 100644
--- a/src/lib/StrictModeDroppable.tsx
+++ b/src/lib/StrictModeDroppable.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useEffect, useState } from 'react';
+import { useEffect, useState } from 'react';
 import { Droppable, DroppableProps } from 'react-beautiful-dnd';
 
 // issue: https://github.com/atlassian/react-beautiful-dnd/issues/2399
diff --git a/src/screens/Browse.tsx b/src/screens/Browse.tsx
index b70e4d9b91..58c5a54ab3 100644
--- a/src/screens/Browse.tsx
+++ b/src/screens/Browse.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useState } from 'react';
+import { useState } from 'react';
 import Tabs from '@mui/material/Tabs';
 import Tab from '@mui/material/Tab';
 import { useTranslation } from 'react-i18next';
diff --git a/src/screens/Extensions.tsx b/src/screens/Extensions.tsx
index 1377416735..62ef028e3b 100644
--- a/src/screens/Extensions.tsx
+++ b/src/screens/Extensions.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
+import { useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { fromEvent } from 'file-selector';
 import IconButton from '@mui/material/IconButton';
 import AddIcon from '@mui/icons-material/Add';
diff --git a/src/screens/Reader.tsx b/src/screens/Reader.tsx
index 63e68cc9f5..4d19b7987d 100644
--- a/src/screens/Reader.tsx
+++ b/src/screens/Reader.tsx
@@ -7,7 +7,7 @@
  */
 
 import CircularProgress from '@mui/material/CircularProgress';
-import React, { useCallback, useContext, useEffect, useState } from 'react';
+import { useCallback, useContext, useEffect, useState } from 'react';
 import { useLocation, useNavigate, useParams } from 'react-router-dom';
 import { Box } from '@mui/material';
 import { useTranslation } from 'react-i18next';
diff --git a/src/screens/Settings.tsx b/src/screens/Settings.tsx
index ed1f753438..d38bcb007f 100644
--- a/src/screens/Settings.tsx
+++ b/src/screens/Settings.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect, useState } from 'react';
+import { useContext, useEffect, useState } from 'react';
 import AutoStoriesIcon from '@mui/icons-material/AutoStories';
 import List from '@mui/material/List';
 import ListAltIcon from '@mui/icons-material/ListAlt';
diff --git a/src/screens/SourceConfigure.tsx b/src/screens/SourceConfigure.tsx
index adc20e41b5..0b761c663d 100644
--- a/src/screens/SourceConfigure.tsx
+++ b/src/screens/SourceConfigure.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect } from 'react';
+import { createElement, useContext, useEffect } from 'react';
 import { useParams } from 'react-router-dom';
 import List from '@mui/material/List';
 import { useTranslation } from 'react-i18next';
@@ -71,7 +71,7 @@ export default function SourceConfigure() {
 
                 // TypeScript is dumb in detecting extra props
                 // @ts-ignore
-                return React.createElement(getPrefComponent(it.type), props);
+                return createElement(getPrefComponent(it.type), props);
             })}
         </List>
     );
diff --git a/src/screens/SourceMangas.tsx b/src/screens/SourceMangas.tsx
index d50445a73c..8f9326273f 100644
--- a/src/screens/SourceMangas.tsx
+++ b/src/screens/SourceMangas.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useCallback, useContext, useEffect, useMemo, useState } from 'react';
+import { useCallback, useContext, useEffect, useMemo, useState } from 'react';
 import { useParams, useNavigate, useLocation } from 'react-router-dom';
 import IconButton from '@mui/material/IconButton';
 import SettingsIcon from '@mui/icons-material/Settings';
diff --git a/src/screens/Sources.tsx b/src/screens/Sources.tsx
index 65166fd2d9..52ed46e041 100644
--- a/src/screens/Sources.tsx
+++ b/src/screens/Sources.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect } from 'react';
+import { Fragment, useContext, useEffect } from 'react';
 import { IconButton } from '@mui/material';
 import TravelExploreIcon from '@mui/icons-material/TravelExplore';
 import { useNavigate } from 'react-router-dom';
@@ -103,7 +103,7 @@ export default function Sources() {
                 .map(
                     ([lang, list]) =>
                         shownLangs.indexOf(lang) !== -1 && (
-                            <React.Fragment key={lang}>
+                            <Fragment key={lang}>
                                 <h1 key={lang} style={{ marginLeft: 25 }}>
                                     {translateExtensionLanguage(lang)}
                                 </h1>
@@ -112,7 +112,7 @@ export default function Sources() {
                                     .map((source) => (
                                         <SourceCard key={source.id} source={source} />
                                     ))}
-                            </React.Fragment>
+                            </Fragment>
                         ),
                 )}
         </>
diff --git a/src/screens/settings/About.tsx b/src/screens/settings/About.tsx
index c927e7873f..db196541fb 100644
--- a/src/screens/settings/About.tsx
+++ b/src/screens/settings/About.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect } from 'react';
+import { useContext, useEffect } from 'react';
 import List from '@mui/material/List';
 import ListItem from '@mui/material/ListItem';
 import ListItemText from '@mui/material/ListItemText';
diff --git a/src/screens/settings/Backup.tsx b/src/screens/settings/Backup.tsx
index 0c4bb2054d..c475559467 100644
--- a/src/screens/settings/Backup.tsx
+++ b/src/screens/settings/Backup.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect } from 'react';
+import { useContext, useEffect } from 'react';
 import List from '@mui/material/List';
 import ListItemText from '@mui/material/ListItemText';
 import { fromEvent } from 'file-selector';
diff --git a/src/screens/settings/Categories.tsx b/src/screens/settings/Categories.tsx
index edf3c81d35..5c0dd99191 100644
--- a/src/screens/settings/Categories.tsx
+++ b/src/screens/settings/Categories.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useMemo, useState, useContext, useEffect } from 'react';
+import { useMemo, useState, useContext, useEffect } from 'react';
 import { List, ListItem, ListItemText, ListItemIcon, IconButton } from '@mui/material';
 import { DragDropContext, Draggable, DropResult, DraggingStyle, NotDraggingStyle } from 'react-beautiful-dnd';
 import DragHandleIcon from '@mui/icons-material/DragHandle';
diff --git a/src/screens/settings/DefaultReaderSettings.tsx b/src/screens/settings/DefaultReaderSettings.tsx
index e54238d572..703cabab93 100644
--- a/src/screens/settings/DefaultReaderSettings.tsx
+++ b/src/screens/settings/DefaultReaderSettings.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect } from 'react';
+import { useContext, useEffect } from 'react';
 import { Box } from '@mui/material';
 import CircularProgress from '@mui/material/CircularProgress';
 import { useTranslation } from 'react-i18next';
diff --git a/src/screens/settings/LibrarySettings.tsx b/src/screens/settings/LibrarySettings.tsx
index de5c3fa080..b6740fae94 100644
--- a/src/screens/settings/LibrarySettings.tsx
+++ b/src/screens/settings/LibrarySettings.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useContext, useEffect, useState } from 'react';
+import { useContext, useEffect, useState } from 'react';
 import List from '@mui/material/List';
 import ListItemText from '@mui/material/ListItemText';
 import ListSubheader from '@mui/material/ListSubheader';
diff --git a/src/screens/settings/SearchSettings.tsx b/src/screens/settings/SearchSettings.tsx
index c6bad8b93f..9568b6a6bb 100644
--- a/src/screens/settings/SearchSettings.tsx
+++ b/src/screens/settings/SearchSettings.tsx
@@ -8,7 +8,6 @@
 
 import { ListItem, ListItemText, Switch } from '@mui/material';
 import ListItemSecondaryAction from '@mui/material/ListItemSecondaryAction';
-import React from 'react';
 import ListItemIcon from '@mui/material/ListItemIcon';
 import SearchIcon from '@mui/icons-material/Search';
 import { useTranslation } from 'react-i18next';
diff --git a/src/util/useLocalStorage.tsx b/src/util/useLocalStorage.tsx
index 95d709e814..59673849b1 100644
--- a/src/util/useLocalStorage.tsx
+++ b/src/util/useLocalStorage.tsx
@@ -6,7 +6,7 @@
  * file, You can obtain one at https://mozilla.org/MPL/2.0/.
  */
 
-import React, { useState, Dispatch, SetStateAction, useReducer, Reducer, useCallback } from 'react';
+import { useState, Dispatch, SetStateAction, useReducer, Reducer, useCallback } from 'react';
 import storage from '@/util/localStorage';
 
 export default function useLocalStorage<T>(key: string, defaultValue: T | (() => T)): [T, Dispatch<SetStateAction<T>>] {
diff --git a/tsconfig.json b/tsconfig.json
index 906e34c0d3..d3a3900cf7 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -2,30 +2,41 @@
   "compilerOptions": {
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./src/*"]
+      "@/*": [
+        "./src/*"
+      ]
     },
-    "target": "ESNext",
+    "target": "ES2020",
+    "useDefineForClassFields": true,
     "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
+      "ESNEXT",
+      "ES2020",
+      "DOM",
+      "DOM.Iterable"
     ],
-    "allowJs": true,
+    "module": "ESNext",
     "skipLibCheck": true,
+    /* Bundler mode */
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
-    "strict": true,
-    "forceConsistentCasingInFileNames": true,
-    "noFallthroughCasesInSwitch": true,
-    "module": "esnext",
-    "moduleResolution": "node",
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react-jsx",
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "forceConsistentCasingInFileNames": true,
+    "noFallthroughCasesInSwitch": true
   },
   "include": [
-    "src",
-    "vite.config.ts"
+    "src"
+  ],
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    }
   ]
 }
diff --git a/tsconfig.node.json b/tsconfig.node.json
new file mode 100644
index 0000000000..6dae8e70c7
--- /dev/null
+++ b/tsconfig.node.json
@@ -0,0 +1,13 @@
+{
+  "compilerOptions": {
+    "composite": true,
+    "skipLibCheck": true,
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "allowSyntheticDefaultImports": true
+  },
+  "include": [
+    "vite.config.ts",
+    "vite.config.ts"
+  ]
+}