Print error when images.loader is assigned but images.path is not (#30080)

Fixes #29744

Author: styfle

docs/api-reference/next/image.md

@@ -37,7 +37,7 @@ Must be one of the following:
 
 1. A [statically imported](/docs/basic-features/image-optimization.md#local-images) image file, or
 2. A path string. This can be either an absolute external URL,
-   or an internal path depending on the [loader](#loader).
+   or an internal path depending on the [loader](#loader) prop or [loader configuration](#loader-configuration).
 
 When using an external URL, you must add it to
 [domains](#domains) in
@@ -250,7 +250,7 @@ module.exports = {
 
 ### Loader Configuration
 
-If you want to use a cloud provider to optimize images instead of using the Next.js built-in Image Optimization API, you can configure the `loader` and `path` prefix in your `next.config.js` file. This allows you to use relative URLs for the Image `src` and automatically generate the correct absolute URL for your provider.
+If you want to use a cloud provider to optimize images instead of using the Next.js built-in Image Optimization API, you can configure the `loader` and `path` prefix in your `next.config.js` file. This allows you to use relative URLs for the Image [`src`](#src) and automatically generate the correct absolute URL for your provider.
 
 ```js
 module.exports = {

packages/next/server/config.ts

@@ -288,6 +288,16 @@ function assignDefaults(userConfig: { [key: string]: any }) {
       )
     }
 
+    if (
+      images.loader !== 'default' &&
+      images.loader !== 'custom' &&
+      !(images.path || '').startsWith('http')
+    ) {
+      throw new Error(
+        `Specified images.loader property (${images.loader}) also requires images.path property to be assigned to a URL prefix.\nSee more info here: https://nextjs.org/docs/api-reference/next/image#loader-configuration`
+      )
+    }
+
     // Append trailing slash for non-default loaders and when trailingSlash is set
     if (images.path) {
       if (

test/integration/image-optimizer/test/index.test.js

@@ -945,6 +945,31 @@ describe('Image Optimizer', () => {
         `Specified images.formats should be an Array of mime type strings, received invalid values (jpeg)`
       )
     })
+
+    it('should error when images.loader is assigned but images.path is not', async () => {
+      await nextConfig.replace(
+        '{ /* replaceme */ }',
+        JSON.stringify({
+          images: {
+            loader: 'imgix',
+          },
+        })
+      )
+      let stderr = ''
+
+      app = await launchApp(appDir, await findPort(), {
+        onStderr(msg) {
+          stderr += msg || ''
+        },
+      })
+      await waitFor(1000)
+      await killApp(app).catch(() => {})
+      await nextConfig.restore()
+
+      expect(stderr).toContain(
+        `Specified images.loader property (imgix) also requires images.path property to be assigned to a URL prefix.`
+      )
+    })
   })
 
   // domains for testing