diff --git a/packages/wxt/src/core/resolve-config.ts b/packages/wxt/src/core/resolve-config.ts
index 4b1486e8..946f6aaf 100644
--- a/packages/wxt/src/core/resolve-config.ts
+++ b/packages/wxt/src/core/resolve-config.ts
@@ -104,13 +104,15 @@ export async function resolveConfig(
     production: '',
     development: '-dev',
   };
+  const modeSuffix = modeSuffixes[mode] ?? `-${mode}`;
   const outDirTemplate = (
-    mergedConfig.outDirTemplate ?? `${browser}-mv${manifestVersion}`
+    mergedConfig.outDirTemplate ??
+    `${browser}-mv${manifestVersion}${modeSuffix}`
   )
     // Resolve all variables in the template
     .replaceAll('{{browser}}', browser)
     .replaceAll('{{manifestVersion}}', manifestVersion.toString())
-    .replaceAll('{{modeSuffix}}', modeSuffixes[mode] ?? `-${mode}`)
+    .replaceAll('{{modeSuffix}}', modeSuffix)
     .replaceAll('{{mode}}', mode)
     .replaceAll('{{command}}', command);
 
diff --git a/packages/wxt/src/types.ts b/packages/wxt/src/types.ts
index 20b352eb..07aa4b47 100644
--- a/packages/wxt/src/types.ts
+++ b/packages/wxt/src/types.ts
@@ -63,8 +63,8 @@ export interface InlineConfig {
    * - <span v-pre>`{{modeSuffix}}`</span>: A suffix based on the mode ('-dev' for development, '' for production)
    * - <span v-pre>`{{command}}`</span>: The WXT command being run (e.g., 'build', 'serve')
    *
-   * @example "{{browser}}-mv{{manifestVersion}}{{modeSuffix}}"
-   * @default <span v-pre>`"{{browser}}-mv{{manifestVersion}}"`</span>
+   * @example "{{browser}}-mv{{manifestVersion}}"
+   * @default <span v-pre>`"{{browser}}-mv{{manifestVersion}}{{modeSuffix}}"`</span>
    */
   outDirTemplate?: string;
   /**