commit 57348c35d8bd6b14d5ed9e1a0715609b616a9de8
parent e29fe05218ecb2a901f7e3f940caf0f541c371aa
Author: ms <ms@taler.net>
Date: Fri, 28 Jan 2022 14:09:16 +0100
bank: fix unrendered style.
template.html was missing the <style>-inlining.
Diffstat:
6 files changed, 78 insertions(+), 45 deletions(-)
diff --git a/packages/bank/package.json b/packages/bank/package.json
@@ -4,13 +4,12 @@
"version": "0.1.0",
"license": "MIT",
"scripts": {
- "build": "preact build --no-sw --no-esm --no-inline-css",
- "serve": "sirv build --port ${PORT:=8080} --cors --single",
"dev": "preact watch --port ${PORT:=8080} --no-sw --no-esm",
+ "build": "preact build --no-sw --no-esm -c preact.single-config.js --dest single && sh remove-link-stylesheet.sh",
+ "serve": "sirv build --port ${PORT:=8080} --cors --single",
"lint": "eslint 'src/**/*.{js,jsx,ts,tsx}'",
"test": "jest ./tests",
"build-storybook": "build-storybook",
- "build-single": "preact build --no-sw --no-esm -c preact.single-config.js --dest single && sh remove-link-stylesheet.sh",
"serve-single": "sirv single --port ${PORT:=8080} --cors --single",
"pretty": "prettier --write src",
"storybook": "start-storybook -p 6006"
@@ -55,6 +54,8 @@
"@types/jest": "^27.0.2",
"@typescript-eslint/eslint-plugin": "^5.3.0",
"@typescript-eslint/parser": "^5.3.0",
+ "babel-loader": "^8.2.2",
+ "base64-inline-loader": "^1.1.1",
"bulma": "^0.9.3",
"bulma-checkbox": "^1.1.1",
"bulma-radio": "^1.1.1",
@@ -62,6 +63,10 @@
"enzyme-adapter-preact-pure": "^3.2.0",
"eslint": "^8.1.0",
"eslint-config-preact": "^1.2.0",
+ "html-webpack-inline-chunk-plugin": "^1.1.1",
+ "html-webpack-inline-source-plugin": "0.0.10",
+ "html-webpack-skip-assets-plugin": "^1.0.1",
+ "inline-chunk-html-plugin": "^1.1.1",
"jest": "^27.3.1",
"jest-fetch-mock": "^3.0.3",
"jest-preset-preact": "^4.0.5",
@@ -72,6 +77,7 @@
"preact-cli": "3.0.5",
"sass": "1.32.13",
"sass-loader": "^10",
+ "script-ext-html-webpack-plugin": "^2.1.5",
"sirv-cli": "^1.0.14",
"typescript": "^4.4.4"
},
diff --git a/packages/bank/preact.config.js b/packages/bank/preact.config.js
@@ -28,18 +28,43 @@ const commitHash = cp.execSync('git rev-parse --short HEAD').toString();
export default {
webpack(config, env, helpers) {
+ // ensure that process.env will not be undefined on runtime
+ config.node.process = 'mock'
+
// add __VERSION__ to be use in the html
config.plugins.push(
new DefinePlugin({
- 'process.env.__VERSION__': JSON.stringify(env.isProd ? pack.version : `dev-${commitHash}`),
+ 'process.env.__VERSION__': JSON.stringify(env.isProd ? pack.version : `dev-${commitHash}`) ,
}),
);
- const crittersWrapper = helpers.getPluginsByName(config, 'Critters')
- if (crittersWrapper && crittersWrapper.length > 0) {
- const [{ index }] = crittersWrapper
- config.plugins.splice(index, 1)
- }
+ // suddenly getting out of memory error from build process, error below [1]
+ // FIXME: remove preact-cli, use rollup
+ let { index } = helpers.getPluginsByName(config, 'WebpackFixStyleOnlyEntriesPlugin')[0]
+ config.plugins.splice(index, 1)
}
}
+
+
+/* [1] from this error decided to remove plugin 'webpack-fix-style-only-entries
+ leaving this error for future reference
+
+
+<--- Last few GCs --->
+
+[32479:0x2e01870] 19969 ms: Mark-sweep 1869.4 (1950.2) -> 1443.1 (1504.1) MB, 497.5 / 0.0 ms (average mu = 0.631, current mu = 0.455) allocation failure scavenge might not succeed
+[32479:0x2e01870] 21907 ms: Mark-sweep 2016.9 (2077.9) -> 1628.6 (1681.4) MB, 1596.0 / 0.0 ms (average mu = 0.354, current mu = 0.176) allocation failure scavenge might not succeed
+
+<--- JS stacktrace --->
+
+==== JS stack trace =========================================
+
+ 0: ExitFrame [pc: 0x13cf099]
+Security context: 0x2f4ca66c08d1 <JSObject>
+ 1: /* anonymous * / [0x35d05555b4b9] [...path/merchant-backoffice/node_modules/.pnpm/webpack-fix-style-only-entries@0.5.2/node_modules/webpack-fix-style-only-entries/index.js:~80] [pc=0x2145e699d1a4](this=0x1149465410e9 <GlobalObject Object map = 0xff481b5b5f9>,0x047e52e36a49 <Dependency map = 0x1ed1fe41cd19>)
+ 2: arguments adaptor frame: 3...
+
+FATAL ERROR: invalid array length Allocation failed - JavaScript heap out of memory
+
+*/
+\ No newline at end of file
diff --git a/packages/bank/src/index.ts b/packages/bank/src/index.ts
@@ -1,4 +0,0 @@
-import App from "./components/app";
-import "./scss/main.scss";
-
-export default App;
diff --git a/packages/bank/src/index.tsx b/packages/bank/src/index.tsx
@@ -0,0 +1,3 @@
+import App from "./components/app";
+
+export default App;
diff --git a/packages/bank/src/pages/home/index.tsx b/packages/bank/src/pages/home/index.tsx
@@ -5,6 +5,7 @@ import { Buffer } from "buffer";
import { useTranslator, Translate } from "../../i18n";
import { QR } from "../../components/QR";
import { useNotNullLocalStorage, useLocalStorage } from "../../hooks";
+import "../../scss/main.scss";
/**
* ToDo:
diff --git a/packages/bank/src/template.html b/packages/bank/src/template.html
@@ -16,36 +16,37 @@
@author Sebastian Javier Marchano
-->
<!DOCTYPE html>
-<html
- lang="en"
- class="has-aside-left has-aside-mobile-transition has-navbar-fixed-top has-aside-expanded"
->
- <head>
- <meta charset="utf-8" />
- <title><%= htmlWebpackPlugin.options.title %></title>
- <meta name="viewport" content="width=device-width,initial-scale=1" />
- <meta name="mobile-web-app-capable" content="yes" />
- <meta name="apple-mobile-web-app-capable" content="yes" />
-
- <link
- rel="icon"
- href="data:;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAABILAAASCwAAAAAAAAAAAAD///////////////////////////////////////////////////////////////////////////////////////////////////7//v38//78/P/+/fz//vz7///+/v/+/f3//vz7///+/v/+/fz//v38///////////////////////+/v3///7+/////////////////////////////////////////////////////////v3//v79///////+/v3///////r28v/ct5//06SG/9Gffv/Xqo7/7N/V/9e2nf/bsJb/6uDW/9Sskf/euKH/+/j2///////+/v3//////+3azv+/eE3/2rWd/9Kkhv/Vr5T/48i2/8J+VP/Qn3//3ryn/795Tf/WrpP/2LCW/8B6T//w4Nb///////Pn4P+/d0v/9u3n/+7d0v/EhV7//v///+HDr//fxLD/zph2/+TJt//8/Pv/woBX//Lm3f/y5dz/v3hN//bu6f/JjGn/4sW0///////Df1j/8OLZ//v6+P+/elH/+vj1//jy7f+/elL//////+zYzP/Eg13//////967p//MlHT/wn5X///////v4Nb/yY1s///////jw7H/06KG////////////z5t9/+fNvf//////x4pn//Pp4v/8+vn/w39X/8WEX///////5s/A/9CbfP//////27Oc/9y2n////////////9itlf/gu6f//////86Vdf/r2Mz//////8SCXP/Df1j//////+7d0v/KkG7//////+HBrf/VpYr////////////RnoH/5sq6///////Ii2n/8ubf//39/P/Cf1j/xohk/+bNvv//////wn5W//Tq4//58/D/wHxV//7+/f/59fH/v3xU//39/P/w4Nf/xIFb///////hw7H/yo9t/+/f1f/AeU3/+/n2/+nSxP/FhmD//////9qzm//Upon/4MSx/96+qf//////xINc/+3bz//48e3/v3hN//Pn3///////6M+//752S//gw6//06aK/8J+VP/kzLr/zZd1/8OCWv/q18r/17KZ/9Ooi//fv6r/v3dK/+vWyP///////v39///////27un/1aeK/9Opjv/m1cf/1KCC/9a0nP/n08T/0Jx8/82YdP/QnHz/16yR//jx7P///////v39///////+/f3///7+///////+//7//v7+///////+/v7//v/+/////////////////////////v7//v79///////////////////+/v/+/Pv//v39///+/v/+/Pv///7+//7+/f/+/Pv//v39//79/P/+/Pv///7+////////////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=="
- />
- <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
-
- <% if (htmlWebpackPlugin.options.manifest.theme_color) { %>
- <meta
- name="theme-color"
- content="<%= htmlWebpackPlugin.options.manifest.theme_color %>"
- />
- <% } %>
- </head>
- <body>
- <script>
- <%= compilation.assets[htmlWebpackPlugin.files.chunks["polyfills"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
- </script>
- <script>
- <%= compilation.assets[htmlWebpackPlugin.files.chunks["bundle"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
- </script>
- </body>
+<html lang="en" class="has-aside-left has-aside-mobile-transition has-navbar-fixed-top has-aside-expanded">
+ <head>
+ <meta charset="utf-8">
+ <title><%= htmlWebpackPlugin.options.title %></title>
+ <meta name="viewport" content="width=device-width,initial-scale=1">
+ <meta name="mobile-web-app-capable" content="yes">
+ <meta name="apple-mobile-web-app-capable" content="yes">
+
+ <link rel="icon" href="data:;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAABILAAASCwAAAAAAAAAAAAD///////////////////////////////////////////////////////////////////////////////////////////////////7//v38//78/P/+/fz//vz7///+/v/+/f3//vz7///+/v/+/fz//v38///////////////////////+/v3///7+/////////////////////////////////////////////////////////v3//v79///////+/v3///////r28v/ct5//06SG/9Gffv/Xqo7/7N/V/9e2nf/bsJb/6uDW/9Sskf/euKH/+/j2///////+/v3//////+3azv+/eE3/2rWd/9Kkhv/Vr5T/48i2/8J+VP/Qn3//3ryn/795Tf/WrpP/2LCW/8B6T//w4Nb///////Pn4P+/d0v/9u3n/+7d0v/EhV7//v///+HDr//fxLD/zph2/+TJt//8/Pv/woBX//Lm3f/y5dz/v3hN//bu6f/JjGn/4sW0///////Df1j/8OLZ//v6+P+/elH/+vj1//jy7f+/elL//////+zYzP/Eg13//////967p//MlHT/wn5X///////v4Nb/yY1s///////jw7H/06KG////////////z5t9/+fNvf//////x4pn//Pp4v/8+vn/w39X/8WEX///////5s/A/9CbfP//////27Oc/9y2n////////////9itlf/gu6f//////86Vdf/r2Mz//////8SCXP/Df1j//////+7d0v/KkG7//////+HBrf/VpYr////////////RnoH/5sq6///////Ii2n/8ubf//39/P/Cf1j/xohk/+bNvv//////wn5W//Tq4//58/D/wHxV//7+/f/59fH/v3xU//39/P/w4Nf/xIFb///////hw7H/yo9t/+/f1f/AeU3/+/n2/+nSxP/FhmD//////9qzm//Upon/4MSx/96+qf//////xINc/+3bz//48e3/v3hN//Pn3///////6M+//752S//gw6//06aK/8J+VP/kzLr/zZd1/8OCWv/q18r/17KZ/9Ooi//fv6r/v3dK/+vWyP///////v39///////27un/1aeK/9Opjv/m1cf/1KCC/9a0nP/n08T/0Jx8/82YdP/QnHz/16yR//jx7P///////v39///////+/f3///7+///////+//7//v7+///////+/v7//v/+/////////////////////////v7//v79///////////////////+/v/+/Pv//v39///+/v/+/Pv///7+//7+/f/+/Pv//v39//79/P/+/Pv///7+////////////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==" />
+ <link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon" />
+
+ <% if (htmlWebpackPlugin.options.manifest.theme_color) { %>
+ <meta name="theme-color" content="<%= htmlWebpackPlugin.options.manifest.theme_color %>">
+ <% } %>
+
+ <% for (const index in htmlWebpackPlugin.files.css) { %>
+ <% const file = htmlWebpackPlugin.files.css[index] %>
+ <style data-href='<%= file %>' >
+ <%= compilation.assets[file.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
+ </style>
+ <% } %>
+
+ </head>
+ <body>
+
+ <script>
+ <%= compilation.assets[htmlWebpackPlugin.files.chunks["polyfills"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
+ </script>
+ <script>
+ <%= compilation.assets[htmlWebpackPlugin.files.chunks["bundle"].entry.substr(htmlWebpackPlugin.files.publicPath.length)].source() %>
+ </script>
+
+ </body>
</html>
