Force cordova to load before webpack bundle

- Turn off injecting the webpack bundle into the index.html in `webpack.cordova.config` - Add stylesheet import to the index.ejs when IS_CORDOVA == true - Add onload to `cordova.js` script which loads in the `web.js` bundle when IS_CORDOVA == true I believe this is related to #67
MarmadileManteater · Jan 23, 2023 · ff8a84f · ff8a84f
1 parent cd18c64
commit ff8a84f
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 3 deletions.
diff --git a/_scripts/webpack.cordova.config.js b/_scripts/webpack.cordova.config.js
@@ -130,11 +130,12 @@ const config = {
       filename: 'index.html',
       template: path.resolve(__dirname, '../src/index.ejs'),
       nodeModules: false,
+      inject: false
     }),
     new VueLoaderPlugin(),
     new MiniCssExtractPlugin({
-      filename: isDevMode ? '[name].css' : '[name].[contenthash].css',
-      chunkFilename: isDevMode ? '[id].css' : '[id].[contenthash].css',
+      filename: '[name].css',
+      chunkFilename: '[id].css',
     })
   ],
   resolve: {

diff --git a/src/index.ejs b/src/index.ejs
@@ -3,7 +3,18 @@
 
   <head>
     <% if (process.env.IS_CORDOVA) { %>
-    <script src="cordova.js" ></script>
+    <script>
+      // ⌚ Wait for cordova to load before loading webpack
+      const onCordovaLoaded = () => {
+        const script = document.createElement('script')
+        script.src = "web.js"
+        script.defer = true
+        script.async = true
+        document.head.appendChild(script)
+      }
+    </script>
+    <script src="cordova.js" onload="onCordovaLoaded()"></script>
+    <link rel="stylesheet" type="text/css" href="web.css" />
     <% } %>
     <meta charset="utf-8" />
     <meta name="viewport"