chore: worker issue in Vite 4.2.x

https: //github.com/vitejs/vite/issues/12611
Signed-off-by: Vinayak Kulkarni <19776877+vinayakkulkarni@users.noreply.github.com>

assets/workers/csv.worker.ts

@@ -15,14 +15,6 @@ function snooze(ms: number): Promise<void> {
   return new Promise((resolve) => setTimeout(resolve, ms));
 }
 
-addEventListener('message', async (event: MessageEvent) => {
-  const { payload, sleep } = event.data.message;
-  await snooze(sleep);
-  const data = csvParse(payload);
-  const geojson = await transformGeoJSON(data);
-  postMessage(geojson);
-});
-
 /**
  * Transforms a CSV to GeoJSON
  *
@@ -60,3 +52,11 @@ async function transformGeoJSON(
   console.log('built geojson: ', geojson);
   return geojson;
 }
+
+self.addEventListener('message', async (e) => {
+  const message = e.data.message;
+  await snooze(message?.sleep || 0);
+  const data = csvParse(message?.payload);
+  const geojson = await transformGeoJSON(data);
+  self.postMessage(geojson);
+});

config/index.ts

@@ -19,7 +19,7 @@ const nitro: NuxtConfig['nitro'] = {
 const plugins: NuxtConfig['plugins'] = [
   { src: '~/plugins/v-click-outside.ts', mode: 'client' },
   { src: '~/plugins/v-mapbox.ts', mode: 'client' },
-  { src: '~/plugins/v-web-workers.ts', mode: 'client' },
+  { src: '~/plugins/v-web-workers.ts', mode: 'server' },
 ];
 
 const runtimeConfig: NuxtConfig['runtimeConfig'] = {

package.json

@@ -52,22 +52,22 @@
     "@windicss/plugin-scrollbar": "^1.2.3",
     "eslint": "^8.37.0",
     "eslint-config-prettier": "^8.8.0",
-    "eslint-plugin-jsdoc": "^40.1.0",
+    "eslint-plugin-jsdoc": "^40.1.1",
     "eslint-plugin-nuxt": "^4.0.0",
     "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-security": "^1.7.1",
     "eslint-plugin-vue": "^9.10.0",
     "husky": "^8.0.3",
     "lint-staged": "^13.2.0",
-    "nuxt": "3.3.2",
+    "nuxt": "^3.3.2",
     "nuxt-windicss": "^2.6.0",
     "prettier": "^2.8.7",
     "sass": "^1.60.0",
     "shipjs": "^0.26.1",
-    "stylelint": "^15.3.0",
+    "stylelint": "^15.4.0",
     "stylelint-config-recommended-vue": "^1.4.0",
     "stylelint-prettier": "^3.0.0",
-    "typescript": "^5.0.2"
+    "typescript": "^5.0.3"
   },
   "repository": {
     "url": "git+https://github.com/geoql/expenses.git",

pages/index.vue

@@ -112,7 +112,7 @@
       </template>
       <template #tools-tr>
         <div
-          class="visible relative w-10 h-10 z-10 text-sm text-gray-600 bg-gray-200 border border-gray-100 rounded-md hover:bg-gray-300 dark:bg-gray-800 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800"
+          class="opacity-50 cursor-not-allowed visible relative w-10 h-10 z-10 text-sm text-gray-600 bg-gray-200 border border-gray-100 rounded-md hover:bg-gray-300 dark:bg-gray-800 dark:border-gray-700 dark:text-white dark:hover:bg-gray-800"
           title="Upload CSV"
           :class="{
             'dark:bg-gray-800 bg-gray-200': mapStore.$state.utils.upload.shown,
@@ -121,7 +121,7 @@
           }"
         >
           <div
-            class="p-2 cursor-pointer"
+            class="p-2 cursor-pointer pointer-events-none"
             @click="mapStore.toggleUploadsWidget()"
           >
             <svg