vite baseurl configurations fixed

obss · Oct 27, 2023 · 816b42d · 816b42d
1 parent f0de75c
commit 816b42d
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 82 deletions.
diff --git a/README.md b/README.md
diff --git a/src/components/Main.jsx b/src/components/Main.jsx
@@ -345,7 +345,7 @@ const Main = () => {
                 <HashRouter>
                     <div className={'obssTriangle'}>
                         <a className={'triangleIcon'} href={'https://obss.tech/'} target={'_blank'} rel="noreferrer">
-                            <img src={'/obss.png'} alt={'obss'} />
+                            <img src={import.meta.env.BASE_URL + 'obss.png'} alt={'obss'} />
                         </a>
                     </div>
                     <Box flexGrow={1}>
@@ -355,7 +355,12 @@ const Main = () => {
                                     <MenuIcon />
                                 </IconButton>
                                 <Link to={'/'} className="bannerLink">
-                                    <img width={48} className={'menuLogo'} src={'/logo.png'} alt={'logo'} />
+                                    <img
+                                        width={48}
+                                        className={'menuLogo'}
+                                        src={import.meta.env.BASE_URL + 'logo.png'}
+                                        alt={'logo'}
+                                    />
                                     <span className="bannerText">comfort-react</span>
                                 </Link>
                                 <Box flexGrow={1} />

diff --git a/src/components/Settings.jsx b/src/components/Settings.jsx
@@ -17,14 +17,14 @@ const Settings = (props) => {
             <Tooltip placement="bottom" title="View on GitHub">
                 <span className={'githubIcon'}>
                     <a href={'https://github.com/obss/comfort-react'} target="_blank" rel="noreferrer">
-                        <img src={'/github.png'} alt="github_icon" />
+                        <img src={import.meta.env.BASE_URL + 'github.png'} alt="github_icon" />
                     </a>
                 </span>
             </Tooltip>
             <Tooltip placement="bottom" title="View on npmjs">
                 <span className={'npmIcon'}>
                     <a href={'https://www.npmjs.com/package/comfort-react'} target="_blank" rel="noreferrer">
-                        <img src={'/npm.png'} alt="npm_icon" />
+                        <img src={import.meta.env.BASE_URL + 'npm.png'} alt="npm_icon" />
                     </a>
                 </span>
             </Tooltip>

diff --git a/src/components/ValidationResult.jsx b/src/components/ValidationResult.jsx
@@ -1,7 +1,7 @@
 import './ValidationResult.css';
 
 const ValidationResult = ({ isValid }) => {
-    let imgSrc = '/';
+    let imgSrc = import.meta.env.BASE_URL;
     let validationResultText = '';
     if (isValid) {
         imgSrc += 'valid.png';

diff --git a/vite.config.ts b/vite.config.ts
@@ -1,10 +1,12 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-  plugins: [react({
-    include: '**/*.{js,jsx,tsx}',
-  })],
-  base: '/comfort-react-demo/'
-})
+    plugins: [
+        react({
+            include: '**/*.{js,jsx,tsx}',
+        }),
+    ],
+    base: '/comfort-react-demo/',
+});