fix(node): use correct main entry file extension based on project config (#14894)

e2e/node/src/node-esbuild.test.ts

@@ -26,9 +26,9 @@ describe('Node Applications + esbuild', () => {
     updateFile(`apps/${app}/src/main.ts`, `console.log('Hello World!');`);
     await runCLIAsync(`build ${app}`);
 
-    checkFilesExist(`dist/apps/${app}/main.cjs`);
+    checkFilesExist(`dist/apps/${app}/main.js`);
-    checkFilesExist(`dist/apps/${app}/main.cjs.map`);
+    checkFilesExist(`dist/apps/${app}/main.js.map`);
-    const result = execSync(`node dist/apps/${app}/main.cjs`, {
+    const result = execSync(`node dist/apps/${app}/main.js`, {
       cwd: tmpProjPath(),
     }).toString();
     expect(result).toMatch(/Hello World!/);

e2e/node/src/node.test.ts

@@ -63,8 +63,8 @@ describe('Node Applications', () => {
     updateFile(`apps/${nodeapp}/src/main.ts`, `console.log('Hello World!');`);
     await runCLIAsync(`build ${nodeapp}`);
 
-    checkFilesExist(`dist/apps/${nodeapp}/main.cjs`);
+    checkFilesExist(`dist/apps/${nodeapp}/main.js`);
-    const result = execSync(`node dist/apps/${nodeapp}/main.cjs`, {
+    const result = execSync(`node dist/apps/${nodeapp}/main.js`, {
       cwd: tmpProjPath(),
     }).toString();
     expect(result).toContain('Hello World!');
@@ -80,7 +80,7 @@ describe('Node Applications', () => {
     });
 
     await runCLIAsync(`build ${nodeapp}`);
-    checkFilesExist(`dist/apps/${nodeapp}/index.cjs`);
+    checkFilesExist(`dist/apps/${nodeapp}/index.js`);
   }, 300000);
 
   it('should be able to generate an empty application with additional entries', async () => {

packages/esbuild/src/executors/esbuild/esbuild.impl.ts

@@ -16,13 +16,15 @@ import { normalizeOptions } from './lib/normalize';
 import { EsBuildExecutorOptions } from './schema';
 import { removeSync, writeJsonSync } from 'fs-extra';
 import { createAsyncIterable } from '@nrwl/devkit/src/utils/async-iterable';
-import { buildEsbuildOptions, getOutfile } from './lib/build-esbuild-options';
+import {
+  buildEsbuildOptions,
+  getOutExtension,
+  getOutfile,
+} from './lib/build-esbuild-options';
 import { getExtraDependencies } from './lib/get-extra-dependencies';
 import { DependentBuildableProjectNode } from '@nrwl/workspace/src/utilities/buildable-libs-utils';
 import { join } from 'path';
 
-const CJS_FILE_EXTENSION = '.cjs' as const;
-
 const BUILD_WATCH_FAILED = `[ ${chalk.red(
   'watch'
 )} ] build finished with errors (see above), watching for changes...`;
@@ -68,7 +70,7 @@ export async function* esbuildExecutor(
     ...options,
     // TODO(jack): make types generate with esbuild
     skipTypings: true,
-    outputFileExtensionForCjs: CJS_FILE_EXTENSION,
+    outputFileExtensionForCjs: getOutExtension('cjs', options),
     excludeLibsInPackageJson: !options.thirdParty,
     updateBuildableProjectDepsInPackageJson: externalDependencies.length > 0,
   };

packages/esbuild/src/executors/esbuild/lib/build-esbuild-options.ts

@@ -70,10 +70,10 @@ export function buildEsbuildOptions(
   return esbuildOptions;
 }
 
-function getOutExtension(
+export function getOutExtension(
   format: 'cjs' | 'esm',
   options: EsBuildExecutorOptions
-): string {
+): '.cjs' | '.mjs' | '.js' {
   const userDefinedExt = options.esbuildOptions?.outExtension?.['.js'];
   // Allow users to change the output extensions from default CJS and ESM extensions.
   // CJS -> .js

packages/node/src/generators/application/application.ts

@@ -97,6 +97,7 @@ function getEsBuildConfig(
         'dist',
         options.rootProject ? options.name : options.appProjectRoot
       ),
+      // Use CJS for Node apps for widest compatibility.
       format: ['cjs'],
       main: joinPathFragments(
         project.sourceRoot,
@@ -104,7 +105,11 @@ function getEsBuildConfig(
       ),
       tsConfig: joinPathFragments(options.appProjectRoot, 'tsconfig.app.json'),
       assets: [joinPathFragments(project.sourceRoot, 'assets')],
-      esbuildOptions: { sourcemap: true },
+      esbuildOptions: {
+        sourcemap: true,
+        // Generate CJS files as .js so imports can be './foo' rather than './foo.cjs'.
+        outExtension: { '.js': '.js' },
+      },
     },
     configurations: {
       production: {