Improve standalone build version text

src/build/version-loader.js

@@ -1,8 +0,0 @@
-module.exports = () => {
-  if (process.env.STANDALONE) {
-    const now = new Date();
-    const dateString = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}-${now.getDate().toString().padStart(2, '0')}`;
-    return `export default ${JSON.stringify(`Standalone version (${dateString})`)}`;
-  }
-  return `export default null;`;
-};

src/p4/P4.svelte

@@ -9,8 +9,7 @@
   import Progress from './Progress.svelte';
   import Modals from './Modals.svelte';
   import {progress, theme} from './stores';
-  import {isSupported, isSafari, isStandalone} from './environment';
-  import version from '../build/version-loader!';
+  import {isSupported, isSafari, isStandalone, version} from './environment';
   import {APP_NAME, FEEDBACK_PRIMARY, FEEDBACK_SECONDARY, ACCENT_COLOR, SOURCE_CODE, WEBSITE} from '../packager/brand';
 
   let projectData;
@@ -108,6 +107,13 @@
   .disclaimer {
     font-style: italic;
   }
+  .version {
+    font-size: small;
+    opacity: 0.8;
+  }
+  .version a {
+    color: inherit;
+  }
 </style>
 
 <Modals bind:modalVisible={modalVisible} />
@@ -117,7 +123,12 @@
     <div>
       <h1>{APP_NAME}</h1>
       {#if version}
-        <p><i>{version}</i> - <a href={WEBSITE}>Online version</a></p>
+        <p class="version">
+          {version}
+          {#if isStandalone}
+            - <a href={WEBSITE}>{WEBSITE}</a>
+          {/if}
+        </p>
       {/if}
       <p>{$_('p4.description1')}</p>
       <p>

src/p4/environment.js

@@ -4,3 +4,5 @@ export const isSupported = typeof TextDecoder === 'function';
 export const isSafari = navigator.vendor === 'Apple Computer, Inc.';
 
 export const isStandalone = !!process.env.STANDALONE;
+
+export const version = process.env.VERSION;

webpack.config.js

@@ -15,6 +15,21 @@ const base = {
 const dist = path.resolve(__dirname, 'dist');
 const buildId = isProduction ? require('./src/build/generate-scaffolding-build-id') : null;
 
+const getVersion = () => {
+  if (process.env.VERSION) {
+    return process.env.VERSION;
+  }
+  if (isStandalone) {
+    const now = new Date();
+    const dateString = `${now.getFullYear()}-${(now.getMonth() + 1).toString().padStart(2, '0')}-${now.getDate().toString().padStart(2, '0')}`;
+    const packageJSON = require('./package.json');
+    const version = packageJSON.version;
+    return `Standalone v${version} (${dateString})`;
+  }
+  return null;
+};
+const version = getVersion();
+
 const makeScaffolding = ({full}) => ({
   ...base,
   devtool: isProduction ? '' : 'source-map',
@@ -155,6 +170,7 @@ const makeWebsite = () => ({
     new webpack.DefinePlugin({
       'process.env.ENABLE_SERVICE_WORKER': JSON.stringify(process.env.ENABLE_SERVICE_WORKER),
       'process.env.STANDALONE': JSON.stringify(isStandalone ? true : false),
+      'process.env.VERSION': JSON.stringify(version),
       'process.env.PLAUSIBLE_API': JSON.stringify(process.env.PLAUSIBLE_API),
       'process.env.PLAUSIBLE_DOMAIN': JSON.stringify(process.env.PLAUSIBLE_DOMAIN),
     }),