pwa app is now working

This commit is contained in:
Dobromir Popov
2024-04-07 01:10:26 +03:00
parent e4e3f9581a
commit 807bb35973
5 changed files with 102 additions and 10 deletions

10
.gitignore vendored
View File

@ -10,8 +10,16 @@ lerna-debug.log*
.yarn-integrity
.npm
.eslintcache
# PWA files
**/public/sw.js
**/public/workbox-*.js
**/public/worker-*.js
**/public/sw.js.map
**/public/workbox-*.js.map
**/public/worker-*.js.map
.eslintcache
*.tsbuildinfo
next-env.d.ts

View File

@ -1,6 +1,10 @@
const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer');
module.exports = {
const withPWA = require('next-pwa')({
dest: 'public'
})
module.exports = withPWA({
typescript: {
// !! WARN !!
// Dangerously allow production builds to successfully complete even if
@ -42,4 +46,4 @@ module.exports = {
return config;
},
}
})

View File

@ -1,4 +1,5 @@
import { SessionProvider } from "next-auth/react"
import type { Metadata } from "next"
import "../styles/styles.css"
import "../styles/global.css"
import "tailwindcss/tailwind.css"
@ -13,6 +14,39 @@ import { AdapterDayjs } from '@mui/x-date-pickers/AdapterDayjs'
// Use of the <SessionProvider> is mandatory to allow components that call
// `useSession()` anywhere in your application to access the `session` object.
export const metadata: Metadata = {
title: "Специално Свидетелстване София",
description: "Специално Свидетелстване София",
/// manifest: "/manifest.json",
// manifest: {
// theme_color: "#000000",
// background_color: "#ffffff",
// icons: [
// {
// purpose: "maskable",
// sizes: "512x512",
// src: "favicon.png",
// type: "image/png"
// },
// {
// purpose: "any",
// sizes: "512x512",
// src: "favicon.png",
// type: "image/png"
// }
// ],
// orientation: "any",
// display: "standalone",
// dir: "auto",
// lang: "en-US",
// name: "Специално Свидетелстване София",
// short_name: "ССС",
// start_url: "/",
// scope: "/cart"
// },
}
export default function App({
Component,
pageProps: { session, ...pageProps },
@ -28,13 +62,6 @@ export default function App({
return (
<>
<Head>
{/* Other tags */}
<link
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
rel="stylesheet"
/>
</Head>
<SessionProvider session={session} >
<LocalizationProvider dateAdapter={AdapterDayjs}>
<Component {...pageProps} />

27
pages/_document.tsx Normal file
View File

@ -0,0 +1,27 @@
import Document, { Html, Head, Main, NextScript } from "next/document";
class MyDocument extends Document {
render() {
return (
<Html>
<Head>
<link
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css"
rel="stylesheet"
/>
<link rel="manifest" href="/manifest.json" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
<link rel="apple-touch-icon" href="/icon.png"></link>
<meta name="theme-color" content="#fff" />
</Head>
<body>
<Main />
<NextScript />
</body>
</Html>
);
}
}
export default MyDocument;

26
public/manifest.json Normal file
View File

@ -0,0 +1,26 @@
{
"theme_color": "#ffffff",
"background_color": "#e36600",
"icons": [
{
"purpose": "maskable",
"sizes": "512x512",
"src": "favicon.png",
"type": "image/png"
},
{
"purpose": "any",
"sizes": "512x512",
"src": "favicon.png",
"type": "image/png"
}
],
"orientation": "any",
"display": "standalone",
"dir": "auto",
"lang": "en-US",
"name": "Специално Свидетелстване София",
"short_name": "ССС",
"start_url": "/",
"scope": "/cart"
}