diff --git a/.changeset/tall-mice-divide.md b/.changeset/tall-mice-divide.md
new file mode 100644
index 0000000000..9773a50560
--- /dev/null
+++ b/.changeset/tall-mice-divide.md
@@ -0,0 +1,5 @@
+---
+'@atlaspack/packager-js': patch
+---
+
+Add the 'asset-file-names-in-output' debug tool to the DevPackager
diff --git a/packages/packagers/js/src/DevPackager.js b/packages/packagers/js/src/DevPackager.js
index f7a6c7bb4f..1328b696e3 100644
--- a/packages/packagers/js/src/DevPackager.js
+++ b/packages/packagers/js/src/DevPackager.js
@@ -6,6 +6,7 @@ import {
   relativeBundlePath,
   countLines,
   normalizeSeparators,
+  debugTools,
 } from '@atlaspack/utils';
 import SourceMap from '@parcel/source-map';
 import {getFeatureFlag} from '@atlaspack/feature-flags';
@@ -127,11 +128,20 @@ export class DevPackager {
 
         let {code, mapBuffer} = results[i];
         let output = code || '';
+
         wrapped +=
           JSON.stringify(this.bundleGraph.getAssetPublicId(asset)) +
-          ':[function(require,module,exports,__globalThis) {\n' +
-          output +
-          '\n},';
+          ':[function(require,module,exports,__globalThis) {\n';
+
+        if (debugTools['asset-file-names-in-output']) {
+          let assetPath = path.relative(
+            this.options.projectRoot,
+            asset.filePath,
+          );
+          wrapped += `/* ${assetPath} */\n`;
+        }
+
+        wrapped += output + '\n},';
         wrapped += JSON.stringify(deps);
         wrapped += ']';