Merge pull request #2187 from embroider-build/clean-config

bundle up vite plugins in a nicer way

packages/vite/index.mjs

@@ -7,3 +7,5 @@ export * from './src/optimize-deps.js';
 export * from './src/build.js';
 export * from './src/assets.js';
 export * from './src/content-for.js';
+export * from './src/classic-ember-support.js';
+export * from './src/ember.js';

packages/vite/src/classic-ember-support.ts

@@ -0,0 +1,9 @@
+import { hbs } from './hbs.js';
+import { scripts } from './scripts.js';
+import { compatPrebuild } from './build.js';
+import { assets } from './assets.js';
+import { contentFor } from './content-for.js';
+
+export function classicEmberSupport() {
+  return [hbs(), scripts(), compatPrebuild(), assets(), contentFor()];
+}

packages/vite/src/ember.ts

@@ -0,0 +1,50 @@
+import { templateTag } from './template-tag.js';
+import { resolver } from './resolver.js';
+import { mergeConfig, type UserConfig, type ConfigEnv } from 'vite';
+import { esBuildResolver } from './esbuild-resolver.js';
+
+export let extensions = ['.mjs', '.gjs', '.js', '.mts', '.gts', '.ts', '.hbs', '.hbs.js', '.json'];
+
+export function ember() {
+  return [
+    templateTag(),
+    resolver(),
+    {
+      name: 'vite-plugin-ember-config',
+      async config(config: UserConfig, env: ConfigEnv) {
+        return mergeConfig(
+          {
+            resolve: {
+              extensions,
+            },
+
+            optimizeDeps: {
+              exclude: ['@embroider/macros'],
+              extensions: ['.hbs', '.gjs', '.gts'],
+              esbuildOptions: {
+                plugins: [esBuildResolver()],
+              },
+            },
+
+            build: {
+              rollupOptions: {
+                input: {
+                  main: 'index.html',
+                  ...(shouldBuildTests(env.mode) ? { tests: 'tests/index.html' } : undefined),
+                },
+              },
+            },
+            server: {
+              port: 4200,
+            },
+          },
+          config
+        );
+      },
+    },
+  ];
+}
+
+function shouldBuildTests(mode: string) {
+  return mode !== 'production' || process.env.FORCE_BUILD_TESTS;
+}

tests/app-template/vite.config.mjs

@@ -1,70 +1,15 @@
 import { defineConfig } from "vite";
-import {
-  resolver,
-  hbs,
-  scripts,
-  templateTag,
-  optimizeDeps,
-  compatPrebuild,
-  assets,
-  contentFor,
-} from "@embroider/vite";
-import { resolve } from "path";
+import { extensions, classicEmberSupport, ember } from "@embroider/vite";
 import { babel } from "@rollup/plugin-babel";
 
-export default defineConfig(({ mode }) => {
-  return {
-    cacheDir: resolve("node_modules", ".vite"),
-    resolve: {
-      extensions: [
-        ".mjs",
-        ".gjs",
-        ".js",
-        ".mts",
-        ".gts",
-        ".ts",
-        ".hbs",
-        ".hbs.js",
-        ".json",
-      ],
-    },
-    plugins: [
-      hbs(),
-      templateTag(),
-      scripts(),
-      resolver(),
-      compatPrebuild(),
-      assets(),
-      contentFor(),
-
-      babel({
-        babelHelpers: "runtime",
-
-        // this needs .hbs because our hbs() plugin above converts them to
-        // javascript but the javascript still also needs babel, but we don't want
-        // to rename them because vite isn't great about knowing how to hot-reload
-        // them if we resolve them to made-up names.
-        extensions: [".gjs", ".js", ".hbs", ".ts", ".gts"],
-      }),
-    ],
-    optimizeDeps: optimizeDeps(),
-    server: {
-      port: 4200,
-    },
-    build: {
-      outDir: "dist",
-      rollupOptions: {
-        input: {
-          main: "index.html",
-          ...(shouldBuildTests(mode)
-            ? { tests: "tests/index.html" }
-            : undefined),
-        },
-      },
-    },
-  };
+export default defineConfig({
+  plugins: [
+    classicEmberSupport(),
+    ember(),
+    // extra plugins here
+    babel({
+      babelHelpers: "runtime",
+      extensions,
+    }),
+  ],
 });
-
-function shouldBuildTests(mode) {
-  return mode !== "production" || process.env.FORCE_BUILD_TESTS;
-}

tests/scenarios/v2-addon-dev-test.ts

@@ -372,10 +372,8 @@ appScenarios
     });
 
     project.files['vite.config.mjs'] = (project.files['vite.config.mjs'] as string).replace(
-      'contentFor(),',
-      `
-      contentFor(),
-      {
+      '// extra plugins here',
+      `{
         name: "xyz-handler",
         transform(code, id) {
           if (id.endsWith('.xyz')) {