After upgrading to Vite 3 and with latest SvelteKit `process.env.NODE_ENV` is not replaced anymore

Describe the bug

I was using "@sveltejs/kit": "1.0.0-next.370" and "vite": "2.9.14".

After the upgrade to "@sveltejs/kit": "1.0.0-next.391" and "vite": "3.0.2" I’m having issue with service-worker.ts which has this code in it:

/// <reference lib="webworker" />

import {
	precacheAndRoute,
	createHandlerBoundToURL,
	cleanupOutdatedCaches,
} from "workbox-precaching";
import { NavigationRoute, registerRoute } from "workbox-routing";

import { build, files, version } from "$service-worker";

const worker = self as unknown as ServiceWorkerGlobalScope;

cleanupOutdatedCaches();

precacheAndRoute([
	...build.map((f) => ({ url: f, revision: null })),
  /// more code
]);

// other workbox code

What is happening is that after npm run build (vite build) the service-worker.js in build directory contains code like:

....M="production"===process.env.NODE_ENV?K:A;class l extends Error{constructor(e,t).....

As you can see process.env.NODE_ENV is not replaced.

Reading on vitejs config I saw the define property which should do replacement like this:

define: {
  "process.env.NODE_ENV": '"production"',
  //"process.env.NODE_ENV": import.meta.env.MODE, // this doesn't work
},

I think this is not correct usage in SvelteKit.

I think SvelteKit should replace automagically that env because it’s so common in the world.

System Info

System:
    OS: Windows 10 10.0.19044
  Binaries:
    Node: 16.16.0 - C:\Program Files\nodejs\node.EXE
    npm: 8.15.0 - C:\Program Files\nodejs\npm.CMD
  npmPackages:
    @sveltejs/adapter-static: 1.0.0-next.38 => 1.0.0-next.38
    @sveltejs/kit: 1.0.0-next.391 => 1.0.0-next.391
    svelte: 3.49.0 => 3.49.0
    vite: 3.0.2 => 3.0.2

Severity

blocking an upgrade

[dnotes]

Confirmed that #7140 (which went live in @sveltejs/kit@1.0.0-next.509) makes it possible to create a functional Workbox service worker.

If you are using Workbox to build your service worker, you will need to add the following configuration to your vite.config file. Note that this requires exporting a defineConfig function instead of a simple config object.

export default defineConfig(({ mode }) => {
    // ...the rest of your Vite configuration...
    define: {
        'process.env.NODE_ENV': mode === 'production' ? '"production"' : '"development"'
    },
}

I think this can be closed, but I wonder if a note about this should be included in 10_service_workers? Anyone who uses Workbox (or perhaps any other service worker library, I haven’t tried) will have a failing service worker until they implement this configuration, and the console errors for that sort of thing are not very helpful.

[frederikhors]

I’m using this code right now:

import { sveltekit } from "@sveltejs/kit/vite";
import { defineConfig } from "vite";

export default defineConfig(({ mode }) => {
  return {
    plugins: [sveltekit()],

    define: {
      "process.env.NODE_ENV":
        mode === "production" ? '"production"' : '"development"',
    },

    //other configs...
  };
});

Wat do you think?