fix(js): update library generator for webpack and rollup bundler (#12183)

docs/generated/packages/webpack.json

@@ -146,7 +146,8 @@
           },
           "target": {
             "type": "string",
-            "description": "Target platform for the build, same as the Webpack config option.",
+            "alias": "platform",
+            "description": "Target platform for the build, same as the Webpack target option.",
             "enum": ["node", "web"],
             "default": "web"
           },

e2e/webpack/src/webpack.test.ts

@@ -1,6 +1,7 @@
 import {
   cleanupProject,
   newProject,
+  readFile,
   rmDist,
   runCLI,
   runCommand,
@@ -55,4 +56,27 @@ describe('Webpack Plugin', () => {
     output = runCommand(`node dist/libs/${myPkg}/main.js`);
     expect(output).toMatch(/Hello/);
   }, 500000);
+
+  it('should define process.env variables only for --platform=web', async () => {
+    const myPkg = uniq('my-pkg');
+    runCLI(`generate @nrwl/js:lib ${myPkg} --bundler=webpack`);
+    updateFile(
+      `libs/${myPkg}/src/index.ts`,
+      `console.log(process.env['NX_TEST_VAR']);\n`
+    );
+
+    process.env.NX_TEST_VAR = 'Hello build time';
+    runCLI(`build ${myPkg} --platform=node`);
+
+    process.env.NX_TEST_VAR = 'Hello run time';
+    expect(runCommand(`node dist/libs/${myPkg}/main.js`)).toMatch(
+      /Hello run time/
+    );
+
+    process.env.NX_TEST_VAR = 'Hello build time';
+    runCLI(`build ${myPkg} --platform=web`);
+
+    expect(readFile(`dist/libs/${myPkg}/main.js`)).toMatch(/Hello build time/);
+    delete process.env.NX_TEST_VAR;
+  }, 300_000);
 });

packages/js/src/generators/library/files/lib/tsconfig.lib.json__tmpl__

@@ -3,7 +3,7 @@
   "compilerOptions": {
     "outDir": "<%= offsetFromRoot %>dist/out-tsc",
     "declaration": true,
-    "types": []
+    "types": ["node"]
   },
   "include": ["**/*.ts"<% if (js) { %>, "**/*.js"<% } %>],
   "exclude": ["jest.config.ts", "**/*.spec.ts", "**/*.test.ts"<% if (js) { %>, "**/*.spec.js", "**/*.test.js"<% } %>]

packages/js/src/generators/library/library.ts

@@ -29,7 +29,7 @@ import { addMinimalPublishScript } from '../../utils/minimal-publish-script';
 import { LibraryGeneratorSchema } from '../../utils/schema';
 import { addSwcConfig } from '../../utils/swc/add-swc-config';
 import { addSwcDependencies } from '../../utils/swc/add-swc-dependencies';
-import { nxVersion } from '../../utils/versions';
+import { nxVersion, typesNodeVersion } from '../../utils/versions';
 
 export async function libraryGenerator(
   tree: Tree,
@@ -58,6 +58,10 @@ export async function projectGenerator(
     updateRootTsConfig(tree, options);
   }
 
+  if (schema.bundler === 'webpack' || schema.bundler === 'rollup') {
+    ensureBabelRootConfigExists(tree);
+  }
+
   if (options.linter !== 'none') {
     const lintCallback = await addLint(tree, options);
     tasks.push(lintCallback);
@@ -108,7 +112,11 @@ function addProject(
         outputPath,
         main: `${options.projectRoot}/src/index` + (options.js ? '.js' : '.ts'),
         tsConfig: `${options.projectRoot}/tsconfig.lib.json`,
-        assets: [`${options.projectRoot}/*.md`],
+        // TODO(jack): assets for webpack and rollup have validation that we need to fix (assets must be under <project-root>/src)
+        assets:
+          options.bundler === 'webpack' || options.bundler === 'rollup'
+            ? []
+            : [`${options.projectRoot}/*.md`],
       },
     };
 
@@ -419,7 +427,7 @@ function addProjectDependencies(
     return addDependenciesToPackageJson(
       tree,
       {},
-      { '@nrwl/esbuild': nxVersion }
+      { '@nrwl/esbuild': nxVersion, '@types/node': typesNodeVersion }
     );
   }
 
@@ -427,7 +435,7 @@ function addProjectDependencies(
     return addDependenciesToPackageJson(
       tree,
       {},
-      { '@nrwl/rollup': nxVersion }
+      { '@nrwl/rollup': nxVersion, '@types/node': typesNodeVersion }
     );
   }
 
@@ -435,7 +443,7 @@ function addProjectDependencies(
     return addDependenciesToPackageJson(
       tree,
       {},
-      { '@nrwl/webpack': nxVersion }
+      { '@nrwl/webpack': nxVersion, '@types/node': typesNodeVersion }
     );
   }
 
@@ -456,5 +464,13 @@ function getBuildExecutor(options: NormalizedSchema) {
   }
 }
 
+function ensureBabelRootConfigExists(tree: Tree) {
+  if (tree.exists('babel.config.json')) return;
+
+  writeJson(tree, 'babel.config.json', {
+    babelrcRoots: ['*'],
+  });
+}
+
 export default libraryGenerator;
 export const librarySchematic = convertNxGenerator(libraryGenerator);

packages/js/src/utils/versions.ts

@@ -4,3 +4,4 @@ export const nxVersion = require('../../package.json').version;
 
 export const swcCliVersion = '~0.1.55';
 export const swcHelpersVersion = '~0.3.3';
+export const typesNodeVersion = '18.7.1';

packages/webpack/src/executors/webpack/schema.json

@@ -33,7 +33,8 @@
     },
     "target": {
       "type": "string",
-      "description": "Target platform for the build, same as the Webpack config option.",
+      "alias": "platform",
+      "description": "Target platform for the build, same as the Webpack target option.",
       "enum": ["node", "web"],
       "default": "web"
     },