chore: tidying up a little more and removing superfluous config

Signed-off-by: blam <ben@blam.sh>

packages/cli/src/lib/bundler/server.ts

@@ -24,6 +24,10 @@ import webpack from 'webpack';
 import WebpackDevServer from 'webpack-dev-server';
 import vite from 'vite';
 import react from '@vitejs/plugin-react';
+import { nodePolyfills as viteNodePolyfills } from 'vite-plugin-node-polyfills';
+import { createHtmlPlugin } from 'vite-plugin-html';
+import { viteCommonjs } from '@originjs/vite-plugin-commonjs';
+import vitePluginSvgr from 'vite-plugin-svgr';
 
 import {
   forbiddenDuplicatesFilter,
@@ -36,10 +40,6 @@ import { createConfig, resolveBaseUrl } from './config';
 import { createDetectedModulesEntryPoint } from './packageDetection';
 import { resolveBundlingPaths } from './paths';
 import { ServeOptions } from './types';
-import { nodePolyfills as viteNodePolyfills } from 'vite-plugin-node-polyfills';
-import { esbuildCommonjs, viteCommonjs } from '@originjs/vite-plugin-commonjs';
-import { viteTransformHtml } from './viteTransformHtml';
-import vitePluginSvgr from 'vite-plugin-svgr';
 
 export async function serveBundle(options: ServeOptions) {
   const paths = resolveBundlingPaths(options);
@@ -178,12 +178,14 @@ export async function serveBundle(options: ServeOptions) {
         vitePluginSvgr(),
         viteCommonjs(),
         viteNodePolyfills(),
-        viteTransformHtml({
-          entryPath: paths.targetEntry,
-          targetHtml: paths.targetHtml,
-          data: {
-            config: frontendConfig,
-            publicPath: config.output?.publicPath,
+        createHtmlPlugin({
+          entry: paths.targetEntry,
+          template: 'public/index.html',
+          inject: {
+            data: {
+              config: frontendConfig,
+              publicPath: config.output?.publicPath,
+            },
           },
         }),
       ],
@@ -191,17 +193,6 @@ export async function serveBundle(options: ServeOptions) {
         host,
         port,
       },
-      optimizeDeps: {
-        esbuildOptions: {
-          plugins: [esbuildCommonjs(['!nano-css'])],
-        },
-      },
-      build: {
-        commonjsOptions: {
-          include: ['*'],
-          transformMixedEsModules: true,
-        },
-      },
       publicDir: paths.targetPublic,
       root: paths.targetPath,
     });

packages/cli/src/lib/bundler/viteTransformHtml.ts

@@ -1,45 +0,0 @@
-/*
- * Copyright 2023 The Backstage Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import { PluginOption } from 'vite';
-import fs from 'fs/promises';
-import { render } from 'ejs';
-import { relative } from 'path';
-
-export const viteTransformHtml = ({
-  targetHtml,
-  entryPath,
-  data,
-}: {
-  targetHtml: string;
-  entryPath: string;
-  data: any;
-}): PluginOption => ({
-  name: 'backstage:transform:html',
-  configureServer(s) {
-    s.middlewares.use(async (req, res, next) => {
-      const html = await fs.readFile(targetHtml, 'utf-8');
-      const rendered = `${render(html, data)}
-      <script type="module" src="${relative(targetHtml, entryPath)}"></script>`;
-
-      if (req.url === '/') {
-        res.end(await s.transformIndexHtml(req.url, rendered));
-      } else {
-        next();
-      }
-    });
-  },
-});