Skip to content

Commit cb5f450

Browse files
HxnDevHxnDev
committed
Changes
1 parent 93a7442 commit cb5f450

File tree

4 files changed

+59
-61
lines changed

4 files changed

+59
-61
lines changed

‎.github/workflows/deploy.yml‎

Lines changed: 9 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -26,46 +26,18 @@ jobs:
2626
- name: Create .nojekyll file 📄
2727
run: touch dist/.nojekyll
2828

29-
- name: Create MIME types configuration 📄
29+
# For GitHub User Pages, we need a properly configured root index.html
30+
- name: Prepare dist for GitHub Pages 📄
3031
run: |
31-
echo '# MIME types configuration
32-
*.jsx application/javascript
33-
*.js application/javascript
34-
' > dist/.htaccess
35-
36-
- name: Prepare for deployment
37-
run: |
38-
# Create an empty public directory in case it doesn't exist
39-
mkdir -p public
4032
# Copy all images to dist to ensure they're available
41-
cp -r public/* dist/ || true
33+
mkdir -p dist/images
34+
cp -r public/images/* dist/images/ || true
35+
36+
# Create proper 404.html for GitHub Pages SPA routing
37+
cp dist/index.html dist/404.html
4238
43-
# Create 404.html for GitHub Pages SPA routing
44-
cat > dist/404.html << 'EOL'
45-
<!DOCTYPE html>
46-
<html>
47-
<head>
48-
<meta charset="utf-8">
49-
<title>Hassan Shahzad | Portfolio</title>
50-
<script type="text/javascript">
51-
// Single Page Apps for GitHub Pages
52-
// MIT License
53-
// https://github.com/rafgraph/spa-github-pages
54-
var pathSegmentsToKeep = 1;
55-
var l = window.location;
56-
l.replace(
57-
l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') +
58-
l.pathname.split('/').slice(0, 1 + pathSegmentsToKeep).join('/') + '/?/' +
59-
l.pathname.slice(1).split('/').slice(pathSegmentsToKeep).join('/').replace(/&/g, '~and~') +
60-
(l.search ? '&' + l.search.slice(1).replace(/&/g, '~and~') : '') +
61-
l.hash
62-
);
63-
</script>
64-
</head>
65-
<body>
66-
</body>
67-
</html>
68-
EOL
39+
# Create a custom type map file to fix MIME type issues
40+
echo '{ "*.js": "application/javascript", "*.jsx": "application/javascript" }' > dist/typesMap.json
6941
7042
- name: Deploy 🚀
7143
uses: JamesIves/github-pages-deploy-action@v4

‎index.html‎

Lines changed: 40 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -4,24 +4,51 @@
44
<meta charset="UTF-8" />
55
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
66
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<meta http-equiv="Content-Type" content="text/javascript; charset=utf-8" />
78
<title>Hassan Shahzad | Portfolio</title>
9+
10+
<!-- Fix for MIME type issues with GitHub Pages -->
11+
<script type="application/javascript">
12+
// This ensures proper MIME type handling
13+
window.addEventListener('error', function(e) {
14+
if (e.target.tagName === 'SCRIPT' && e.target.src.includes('.jsx')) {
15+
const newScript = document.createElement('script');
16+
newScript.src = e.target.src.replace('.jsx', '.js');
17+
newScript.type = 'application/javascript';
18+
document.head.appendChild(newScript);
19+
e.preventDefault();
20+
}
21+
}, true);
22+
</script>
23+
824
<!-- Preload critical JavaScript -->
925
<link rel="modulepreload" href="./src/main.jsx" />
10-
<!-- Script for handling client-side routing on GitHub Pages -->
11-
<script type="text/javascript">
26+
27+
<!-- Script for handling client-side routing -->
28+
<script type="application/javascript">
1229
// Single Page Apps for GitHub Pages
13-
// MIT License
14-
// https://github.com/rafgraph/spa-github-pages
15-
(function(l) {
16-
if (l.search[1] === '/' ) {
17-
var decoded = l.search.slice(1).split('&').map(function(s) {
18-
return s.replace(/~and~/g, '&')
19-
}).join('?');
20-
window.history.replaceState(null, null,
21-
l.pathname.slice(0, -1) + decoded + l.hash
22-
);
30+
// Redirect script that handles subdirectory routing
31+
(function() {
32+
// Only run this in production (GitHub Pages) - not in development
33+
if (window.location.hostname === 'hxndev.github.io') {
34+
// If there's a path in the URL and it's not an asset (doesn't include a dot)
35+
const path = window.location.pathname;
36+
// Only redirect if this isn't a direct asset request
37+
if (path && !path.includes('.') && path !== '/') {
38+
sessionStorage.setItem('redirect_path', path);
39+
window.location.href = '/';
40+
}
41+
42+
// Check if we came from a redirect
43+
const redirectPath = sessionStorage.getItem('redirect_path');
44+
if (redirectPath && window.location.pathname === '/') {
45+
// Clear it so we don't redirect again
46+
sessionStorage.removeItem('redirect_path');
47+
// Push the path to history instead of redirect to avoid loops
48+
window.history.pushState(null, null, redirectPath);
49+
}
2350
}
24-
}(window.location))
51+
})();
2552
</script>
2653
</head>
2754
<body>

‎src/App.jsx‎

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -106,9 +106,6 @@ function App() {
106106
applyPerformanceOptimizations(performanceMetrics);
107107
}, []);
108108

109-
// Determine basename for router based on GitHub Pages deployment
110-
const basename = window.location.hostname.includes('github.io') ? '/hxndev.github.io' : '';
111-
112109
return (
113110
<ThemeProvider>
114111
<style dangerouslySetInnerHTML={{ __html: inlineStyles }} />
@@ -118,7 +115,7 @@ function App() {
118115
<LoadingScreen progress={loadingProgress} isComplete={loadingProgress >= 100} />
119116
)}
120117

121-
<BrowserRouter basename={basename}>
118+
<BrowserRouter>
122119
<ParticleBackground particleCount={50} />
123120
<div
124121
style={{

‎vite.config.js‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,25 +2,30 @@ import { defineConfig } from 'vite';
22
import react from '@vitejs/plugin-react';
33
import path from 'path';
44

5-
// Determine if we're in production mode (GitHub Pages deployment)
6-
const isProduction = process.env.NODE_ENV === 'production';
5+
// This is a GitHub User Pages site (username.github.io), not a Project Pages site
6+
// For User Pages, we don't need a base path
77

88
// https://vitejs.dev/config/
99
export default defineConfig({
1010
plugins: [react()],
1111

12-
// Use different base paths for development and production
13-
base: isProduction ? '/hxndev.github.io/' : '/',
12+
// For GitHub User Pages (username.github.io), base should be '/'
13+
base: '/',
1414

1515
build: {
1616
outDir: 'dist',
1717
sourcemap: true,
18+
// Fix for MIME type issues
1819
rollupOptions: {
1920
output: {
2021
manualChunks: {
2122
react: ['react', 'react-dom'],
2223
mantine: ['@mantine/core', '@mantine/hooks'],
2324
},
25+
// Ensure .jsx files are built as .js files
26+
entryFileNames: 'assets/[name]-[hash].js',
27+
chunkFileNames: 'assets/[name]-[hash].js',
28+
assetFileNames: 'assets/[name]-[hash].[ext]'
2429
},
2530
},
2631
},
@@ -47,7 +52,4 @@ export default defineConfig({
4752
optimizeDeps: {
4853
include: ['react', 'react-dom', '@mantine/core', 'gsap'],
4954
},
50-
51-
// Ensure proper MIME types
52-
assetsInclude: ['**/*.jsx'],
5355
});

0 commit comments

Comments
 (0)