fix(vite): Support fileReplacements for devServer (#13761)

Co-authored-by: ⁢ <john@doe.gov>

packages/vite/plugins/rollup-replace-files.plugin.ts

@@ -1,5 +1,6 @@
 // source: https://github.com/Myrmod/vitejs-theming/blob/master/build-plugins/rollup/replace-files.js
 
+import * as fs from 'fs';
 import { resolve } from 'path';
 
 /**
@@ -14,11 +15,7 @@ export default function replaceFiles(replacements: FileReplacement[]) {
   return {
     name: 'rollup-plugin-replace-files',
     enforce: 'pre',
-    async resolveId(source, importer, options) {
-      const resolved = await this.resolve(source, importer, {
-        ...options,
-        skipSelf: true,
-      });
+    async transform(code, id) {
       /**
        * The reason we're using endsWith here is because the resolved id
        * will be the absolute path to the file. We want to check if the
@@ -27,7 +24,7 @@ export default function replaceFiles(replacements: FileReplacement[]) {
        */
 
       const foundReplace = replacements.find((replacement) =>
-        resolved?.id?.endsWith(replacement.replace)
+        id.endsWith(replacement.replace)
       );
       if (foundReplace) {
         console.info(
@@ -35,15 +32,15 @@ export default function replaceFiles(replacements: FileReplacement[]) {
         );
         try {
           // return new file content
-          return {
-            id: foundReplace.with,
-          };
+          return fs
+            .readFileSync(id.replace(foundReplace.replace, foundReplace.with))
+            .toString();
         } catch (err) {
           console.error(err);
-          return null;
+          return code;
         }
       }
-      return null;
+      return code;
     },
   };
 }