progress

Author: mathu97

packages/@apphosting/adapter-nextjs/e2e/run-local.ts

@@ -53,10 +53,9 @@ const scenarios: Scenario[] = [
     tests: ["middleware.spec.ts"], // Only run middleware-specific tests
   },
   ...configOverrideTestScenarios.map(
-    (scenario: { name: string; config: string; file: string }) => ({
+    (scenario: { name: string; config?: string; file?: string }) => ({
       name: scenario.name,
       setup: async (cwd: string) => {
-        const configContent = scenario.config;
         const files = await fsExtra.readdir(cwd);
         const configFiles = files
           .filter((file) => file.startsWith("next.config."))
@@ -67,6 +66,12 @@ const scenarios: Scenario[] = [
           console.log(`Removed existing config file: ${file}`);
         }
 
+        // skip creating the test config if data is not provided
+        if (!scenario.config || !scenario.file) {
+          return
+        }
+
+        const configContent = scenario.config;
         await fsExtra.writeFile(join(cwd, scenario.file), configContent);
         console.log(`Created ${scenario.file} file with ${scenario.name} config`);
       },

packages/@apphosting/adapter-nextjs/src/overrides.spec.ts

@@ -172,20 +172,32 @@ describe("next config overrides", () => {
     ...config,
     images: {
       ...(config.images || {}),
-      ...(config.images?.unoptimized === undefined && config.images?.loader === undefined 
-          ? { unoptimized: true } 
+      ...(config.images?.unoptimized === undefined && config.images?.loader === undefined
+          ? { unoptimized: true }
           : {}),
     },
   });
 
-  const config = typeof originalConfig === 'function' 
+  const config = typeof originalConfig === 'function'
     ? async (...args) => {
         const resolvedConfig = await originalConfig(...args);
         return fahOptimizedConfig(resolvedConfig);
       }
     : fahOptimizedConfig(originalConfig);
   `;
 
+  const defaultNextConfig = `
+    // @ts-nocheck
+
+    /** @type {import('next').NextConfig} */
+    const nextConfig = {
+      images: {
+        unoptimized: true,
+      }
+    }
+
+    module.exports = nextConfig
+  `
   beforeEach(() => {
     tmpDir = fs.mkdtempSync(path.join(os.tmpdir(), "test-overrides"));
   });
@@ -194,12 +206,12 @@ describe("next config overrides", () => {
     const { overrideNextConfig } = await importOverrides;
     const originalConfig = `
     // @ts-check
- 
+
     /** @type {import('next').NextConfig} */
     const nextConfig = {
       /* config options here */
     }
-    
+
     module.exports = nextConfig
     `;
 
@@ -213,7 +225,7 @@ describe("next config overrides", () => {
       normalizeWhitespace(`
       // @ts-nocheck
       const originalConfig = require('./next.config.original.js');
-      
+
       ${nextConfigOverrideBody}
 
       module.exports = config;
@@ -225,14 +237,14 @@ describe("next config overrides", () => {
     const { overrideNextConfig } = await importOverrides;
     const originalConfig = `
     // @ts-check
-    
+
     /**
      * @type {import('next').NextConfig}
      */
     const nextConfig = {
       /* config options here */
     }
-    
+
     export default nextConfig
     `;
 
@@ -257,7 +269,7 @@ describe("next config overrides", () => {
     const { overrideNextConfig } = await importOverrides;
     const originalConfig = `
     // @ts-check
-    
+
     export default (phase, { defaultConfig }) => {
       /**
        * @type {import('next').NextConfig}
@@ -280,7 +292,7 @@ describe("next config overrides", () => {
       import originalConfig from './next.config.original.mjs';
 
       ${nextConfigOverrideBody}
-      
+
       export default config;
       `),
     );
@@ -290,11 +302,11 @@ describe("next config overrides", () => {
     const { overrideNextConfig } = await importOverrides;
     const originalConfig = `
     import type { NextConfig } from 'next'
-    
+
     const nextConfig: NextConfig = {
       /* config options here */
     }
-    
+
     export default nextConfig
     `;
 
@@ -307,22 +319,21 @@ describe("next config overrides", () => {
       normalizeWhitespace(`
       // @ts-nocheck
       import originalConfig from './next.config.original';
-      
+
       ${nextConfigOverrideBody}
-      
+
       module.exports = config;
       `),
     );
   });
 
-  it("should not do anything if no next.config.* file exists", async () => {
+  it("should create a default next.config.js file if one does not exist yet", async () => {
     const { overrideNextConfig } = await importOverrides;
     await overrideNextConfig(tmpDir, "next.config.js");
-
-    // Assert that no next.config* files were created
-    const files = fs.readdirSync(tmpDir);
-    const nextConfigFiles = files.filter((file) => file.startsWith("next.config"));
-    assert.strictEqual(nextConfigFiles.length, 0, "No next.config files should exist");
+    const updatedConfig = fs.readFileSync(path.join(tmpDir, "next.config.js"), "utf-8");
+    assert.equal(
+      normalizeWhitespace(updatedConfig), normalizeWhitespace(defaultNextConfig),
+    );
   });
 });
 

packages/@apphosting/adapter-nextjs/src/overrides.ts

@@ -10,6 +10,8 @@ import {
 import { join, extname } from "path";
 import { rename as renamePromise } from "fs/promises";
 
+const DEFAULT_NEXT_CONFIG_FILE = 'next.config.js'
+
 /**
  * Overrides the user's Next Config file (next.config.[ts|js|mjs]) to add configs
  * optimized for Firebase App Hosting.
@@ -19,11 +21,21 @@ export async function overrideNextConfig(projectRoot: string, nextConfigFileName
   // Check if the file exists in the current working directory
   const configPath = join(projectRoot, nextConfigFileName);
 
-  if (!(await exists(configPath))) {
-    console.log(`No Next.js config file found at ${configPath}`);
-    return;
+  if (!(await exists(configPath))){
+    console.log(`No Next config file found at ${configPath}, creating one with Firebase App Hosting overrides`);
+    try {
+      await writeFile(join(projectRoot, DEFAULT_NEXT_CONFIG_FILE), defaultNextConfigForFAH());
+    } catch (error) {
+      console.error(`Error creating ${DEFAULT_NEXT_CONFIG_FILE}: ${error}`);
+      throw error;
+    }
+
+    console.log(`Successfully created ${DEFAULT_NEXT_CONFIG_FILE} with Firebase App Hosting overrides`);
+    return
   }
 
+  // A Next Config already exists in the user's project, so it needs to be overriden
+
   // Determine the file extension
   const fileExtension = extname(nextConfigFileName);
   const originalConfigName = `next.config.original${fileExtension}`;
@@ -104,6 +116,26 @@ function getCustomNextConfig(importStatement: string, fileExtension: string) {
   `;
 }
 
+/**
+ * Returns the default Next Config file that is created in the user's project
+ * if one does not exist already. This config ensures the Next.Js app is optimized
+ * for Firebase App Hosting.
+ */
+function defaultNextConfigForFAH() {
+  return `
+    // @ts-nocheck
+
+    /** @type {import('next').NextConfig} */
+    const nextConfig = {
+      images: {
+        unoptimized: true,
+      }
+    }
+
+    module.exports = nextConfig
+  `
+}
+
 /**
  * This function is used to validate the state of an app after running the
  * overrideNextConfig. It validates that: