Skip to content

Commit 23aa701

Browse files
Merge pull request #187 from gridaco/staging
PWA Support
2 parents 95d2401 + 8b42404 commit 23aa701

13 files changed

Lines changed: 946 additions & 75 deletions

editor/.gitignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -32,3 +32,8 @@ yarn-error.log*
3232

3333
# vercel
3434
.vercel
35+
36+
# pwa
37+
public/sw.js
38+
public/workbox*.js
39+
public/fallback*.js

editor/next.config.js

Lines changed: 49 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,6 @@
1-
const TerserPlugin = require("terser-webpack-plugin");
1+
const IS_DEV = process.env.NODE_ENV === "development";
2+
3+
const withPlugins = require("next-compose-plugins");
24
const withTM = require("next-transpile-modules")([
35
// region @editor-app
46
"@editor-app/live-session",
@@ -58,49 +60,52 @@ const withTM = require("next-transpile-modules")([
5860
// -----------------------------
5961
]);
6062

61-
module.exports = withTM({
62-
webpack: (config) => {
63-
config.module.rules.push({
64-
type: "javascript/auto",
65-
test: /\.mjs$/,
66-
include: /node_modules/,
67-
});
68-
69-
config.resolve.fallback = {
70-
fs: false, // used by handlebars
71-
path: false, // used by handlebars
72-
crypto: false, // or crypto-browserify (used for totp auth)
73-
stream: false, // or stream-browserify (used for totp auth)
74-
};
75-
76-
// -----------------------------
77-
// for @flutter-builder classname issue
78-
config.optimization.minimizer.push(
79-
new TerserPlugin({
80-
parallel: true,
81-
terserOptions: {
82-
// https://github.com/webpack-contrib/terser-webpack-plugin#terseroptions
83-
keep_classnames: true,
84-
},
85-
})
86-
);
87-
// -----------------------------
88-
89-
return config;
63+
const withPWA = require("next-pwa")({
64+
register: true,
65+
dest: "public",
66+
disable: IS_DEV,
67+
fallbacks: {
68+
image: "/images/fallback.png",
69+
document: "/_offline",
9070
},
91-
async redirects() {
92-
return [
93-
{
94-
// typo gaurd
95-
source: "/preference",
96-
destination: "/preferences",
97-
permanent: true,
98-
},
71+
});
72+
73+
module.exports = withPlugins(
74+
[
75+
[withTM],
76+
[
77+
withPWA,
9978
{
100-
source: "/files/:key/:id",
101-
destination: "/files/:key?node=:id",
102-
permanent: false,
79+
pwa: {
80+
dest: "public",
81+
// swSrc: "sw.js",
82+
},
10383
},
104-
];
105-
},
106-
});
84+
],
85+
],
86+
{
87+
webpack: (config) => {
88+
config.resolve.fallback = {
89+
fs: false, // used by handlebars
90+
path: false, // used by handlebars
91+
};
92+
93+
return config;
94+
},
95+
async redirects() {
96+
return [
97+
{
98+
// typo gaurd
99+
source: "/preference",
100+
destination: "/preferences",
101+
permanent: true,
102+
},
103+
{
104+
source: "/files/:key/:id",
105+
destination: "/files/:key?node=:id",
106+
permanent: false,
107+
},
108+
];
109+
},
110+
}
111+
);

editor/package.json

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,7 @@
4444
"moment": "^2.29.1",
4545
"monaco-editor": "^0.33.0",
4646
"next": "^12.1.4",
47+
"next-pwa": "^5.6.0",
4748
"pouchdb-adapter-idb": "^7.2.2",
4849
"re-resizable": "^6.9.1",
4950
"react": "^18.2.0",
@@ -72,6 +73,7 @@
7273
"babel-plugin-module-resolver": "^4.1.0",
7374
"css-loader": "^5.2.4",
7475
"next-transpile-modules": "^9.0.0",
76+
"next-compose-plugins": "^2.2.1",
7577
"raw-loader": "^4.0.2",
7678
"typescript": "^4.2.3"
7779
}

editor/pages/_app.tsx

Lines changed: 0 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -32,18 +32,6 @@ function HeadInjection() {
3232
<meta property="title" content="Design to Codes" />
3333
<meta property="description" content="Design to Codes description" />
3434

35-
{/* safari 15 color */}
36-
<meta
37-
name="theme-color"
38-
content="white"
39-
media="(prefers-color-scheme: light)"
40-
/>
41-
<meta
42-
name="theme-color"
43-
content={colors.color_editor_bg_on_dark}
44-
media="(prefers-color-scheme: dark)"
45-
/>
46-
4735
{/* disable zoom */}
4836
<meta
4937
name="viewport"

editor/pages/_document.tsx

Lines changed: 35 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,46 @@
11
import { Html, Head, Main, NextScript } from "next/document";
2+
import { colors } from "theme";
23

34
export default function Document() {
45
return (
56
<Html>
67
<Head>
8+
{/* PWA manifest */}
9+
<link rel="manifest" href="/manifest.json" />
10+
<meta name="application-name" content="PWA App" />
11+
<meta name="apple-mobile-web-app-capable" content="yes" />
12+
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
13+
<meta name="apple-mobile-web-app-title" content="PWA App" />
14+
<meta name="description" content="Best PWA App in the world" />
15+
<meta name="format-detection" content="telephone=no" />
16+
<meta name="mobile-web-app-capable" content="yes" />
17+
<meta name="msapplication-config" content="/icons/browserconfig.xml" />
18+
<meta name="msapplication-TileColor" content="#2B5797" />
19+
<meta name="msapplication-tap-highlight" content="no" />
20+
21+
{/* region Font */}
22+
<link rel="preconnect" href="https://fonts.googleapis.com" />
23+
<link
24+
rel="preconnect"
25+
href="https://fonts.gstatic.com"
26+
crossOrigin=""
27+
/>
28+
{/* (en) Nanum Pen Script (+ ko), Roboto Mono, Inter */}
729
<link
8-
href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&"
30+
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Nanum+Pen+Script&family=Roboto+Mono:wght@400;500;600;700&display=swap"
931
rel="stylesheet"
10-
type="text/css"
32+
/>
33+
34+
{/* safari 15 color */}
35+
<meta
36+
name="theme-color"
37+
content="white"
38+
media="(prefers-color-scheme: light)"
39+
/>
40+
<meta
41+
name="theme-color"
42+
content={colors.color_editor_bg_on_dark}
43+
media="(prefers-color-scheme: dark)"
1144
/>
1245
</Head>
1346
<body>

editor/pages/_offline.tsx

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/// https://www.npmjs.com/package/next-pwa
2+
/// offline fallback
3+
4+
import React from "react";
5+
export default function PWAOfflineFallbackPage() {
6+
return <></>;
7+
}
17.3 KB
Loading
28.2 KB
Loading
58.3 KB
Loading
98.4 KB
Loading

0 commit comments

Comments
 (0)