Логотип вынесен в public, создан компонент для удобства использования

src/App.js

@@ -6,15 +6,15 @@ import {
 import { ConfigProvider } from 'antd'
 import locale from 'antd/lib/locale/ru_RU'
 
-import { OpenAPI } from './services/api'
+import { OpenAPI } from '@api'
-import { getUserToken } from './utils/storage'
+import { getUserToken } from '@utils/storage'
-import { PrivateRoute } from './components/Private'
+import { PrivateRoute } from '@components/Private'
 
-import Main from './pages/Main'
+import Main from '@pages/Main'
-import Login from './pages/Login'
+import Login from '@pages/Login'
-import Register from './pages/Register'
+import Register from '@pages/Register'
 
-import './styles/App.less'
+import '@styles/App.less'
 
 //OpenAPI.BASE = 'http://localhost:3000'
 OpenAPI.TOKEN = async () => getUserToken()

src/components/PageHeader.tsx

@@ -1,11 +1,12 @@
 import { memo } from 'react'
-import { Layout } from 'antd'
 import { Link } from 'react-router-dom'
+import { Layout } from 'antd'
+import { BasicProps } from 'antd/lib/layout/layout'
 
-import logo from '@images/logo_32.png'
 import { headerHeight } from '@utils'
 import { UserMenu } from './UserMenu'
-import { BasicProps } from 'antd/lib/layout/layout'
+
+import Logo from '@images/Logo'
 
 export type PageHeaderProps = BasicProps & {
     title?: string
@@ -17,7 +18,7 @@ export const PageHeader: React.FC<PageHeaderProps> = memo(({ title = 'Монит
     <Layout>
         <Layout.Header className={'header'} {...other}>
             <Link to={'/'} style={{ height: headerHeight }}>
-                <img src={logo} alt={'АСБ'} className={'logo'}/>
+                <Logo />
             </Link>
             {children}
             <h1 className={'title'}>{title}</h1>

src/images/Logo.tsx

@@ -0,0 +1,7 @@
+import { memo } from 'react'
+
+export const Logo = memo<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>>((props) => (
+    <img src={'/images/logo_32.png'} alt={'АСБ'} className={'logo'} {...props} />
+))
+
+export default Logo

src/pages/Login.jsx

@@ -10,9 +10,9 @@ import { invokeWebApiWrapperAsync } from '@components/factory'
 import { loginRules, passwordRules } from '@utils/validationRules'
 
 import '@styles/index.css'
-import logo from '@images/logo_32.png'
+import Logo from '@images/Logo'
 
-const logoIcon = <img src={logo} alt={'АСБ'} className={'logo'} width={130} />
+const logoIcon = <Logo width={130} />
 
 export const Login = memo(() => {
   const history = useHistory()

src/pages/Register.jsx

@@ -21,7 +21,7 @@ import {
     phoneRules
 } from '@utils/validationRules'
 
-import logo from '@images/logo_32.png'
+import Logo from '@images/Logo'
 
 const surnameRules = [...nameRules, { required: true, message: 'Пожалуйста, введите фамилию!' }]
 const regEmailRules = [{ required: true, message: 'Пожалуйста, введите email!' }, ...emailRules]
@@ -37,7 +37,7 @@ const confirmPasswordRules = [
     })
 ]
 
-const logoIcon = <img src={logo} alt={'АСБ'} className={'logo'} width={130}/>
+const logoIcon = <Logo width={130} />
 const showPasswordIcon = visible => (visible ? <EyeTwoTone /> : <EyeInvisibleOutlined />)
 
 const createInput = (name, placeholder, rules, isPassword, dependencies) => (