Use vite config from elm-pages.config.mjs.

examples/docs/elm-pages.config.mjs

@@ -0,0 +1,12 @@
+import { defineConfig } from "vite";
+import { ViteWebfontDownload } from "vite-plugin-webfont-dl";
+
+export default {
+  vite: defineConfig({
+    plugins: [
+      ViteWebfontDownload([
+        "https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&display=swap&subset=latin",
+      ]),
+    ],
+  }),
+};

examples/docs/package.json

@@ -14,7 +14,8 @@
     "elm-optimize-level-2": "^0.3.4",
     "elm-pages": "file:../..",
     "elm-tooling": "^1.3.0",
-    "puppeteer": "^9.1.1"
+    "puppeteer": "^9.1.1",
+    "vite-plugin-webfont-dl": "^1.0.9"
   },
   "dependencies": {
     "airtable": "^0.11.1",

examples/docs/style.css

@@ -1,15 +1,3 @@
-@font-face {
-  font-family: "IBM Plex Mono";
-  font-style: normal;
-  font-weight: 400;
-  font-display: swap;
-  src: url(https://fonts.gstatic.com/s/ibmplexmono/v6/-F63fjptAgt5VM-kVkqdyU8n1i8q131nj-o.woff2)
-    format("woff2");
-  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
-    U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
-    U+FEFF, U+FFFD;
-}
-
 code {
   font-family: "IBM Plex Mono", monospace !important;
 }

examples/pokedex/elm-pages.config.mjs

@@ -0,0 +1,5 @@
+import { defineConfig } from "vite";
+
+export default {
+  vite: defineConfig({}),
+};

generator/src/build.js

@@ -65,7 +65,6 @@ async function run(options) {
     await ensureRequiredExecutables();
     // since init/update are never called in pre-renders, and DataSource.Http is called using pure NodeJS HTTP fetching
     // we can provide a fake HTTP instead of xhr2 (which is otherwise needed for Elm HTTP requests from Node)
-    XMLHttpRequest = {};
 
     const generateCode = codegen.generate(options.base);
 
@@ -75,13 +74,30 @@ async function run(options) {
       preRenderHtml.templateHtml()
     );
 
+    const viteConfig = await import(
+      path.join(process.cwd(), "elm-pages.config.mjs")
+    )
+      .then(async (elmPagesConfig) => {
+        return elmPagesConfig.default.vite || {};
+      })
+      .catch((error) => {
+        console.trace("Config loading error", error);
+        process.exit(1);
+      });
+
     await build({
+      configFile: false,
+      root: process.cwd(),
+      base: options.base,
+
       build: {
         outDir: "dist",
         rollupOptions: {
+          ssr: false,
           input: "elm-stuff/elm-pages/index.html",
         },
       },
+      ...viteConfig,
     });
     const compileClientDone = compileElm(options);
     await compileClientDone;
@@ -90,6 +106,7 @@ async function run(options) {
       "dist/template.html"
     );
 
+    XMLHttpRequest = {};
     const compileCli = compileCliApp(options);
     try {
       await compileCli;

generator/src/dev-server.js

@@ -116,15 +116,29 @@ async function start(options) {
       "elm-stuff/elm-pages/"
     );
   }
+  const viteConfig = await import(
+    path.join(process.cwd(), "elm-pages.config.mjs")
+  )
+    .then(async (elmPagesConfig) => {
+      return elmPagesConfig.default.vite || {};
+    })
+    .catch((error) => {
+      console.trace("Config loading error", error);
+      process.exit(1);
+    });
   const vite = await createViteServer({
-    server: { middlewareMode: "ssr" },
+    server: { middlewareMode: "ssr", base: options.base, port: options.port },
+    configFile: false,
+    root: process.cwd(),
+    base: options.base,
+    ...viteConfig,
   });
 
   const app = connect()
     .use(timeMiddleware())
     .use(serveStaticCode)
     .use(awaitElmMiddleware)
-    // .use(baseMiddleware(options.base))
+    .use(baseMiddleware(options.base))
     .use(serveCachedFiles)
     .use(vite.middlewares)
     .use(processRequest);

vite.config.js

@@ -1,13 +0,0 @@
-export default defineConfig({
-  build: {
-    // generate manifest.json in outDir
-    manifest: true,
-
-    rollupOptions: {
-      // overwrite default .html entry
-
-      input:
-        "/Users/dillonkearns/src/github.com/dillonkearns/elm-pages/examples/docs/public/index.js",
-    },
-  },
-});