fix(js): integrate buildable bundler and compiler options (#15376)

docs/generated/packages/js/documents/overview.md

@@ -54,13 +54,13 @@ nx g @nrwl/js:lib my-lib
 
 ## Build
 
-You can `build` libraries that are generated with `--buildable` flag.
+You can `build` libraries that are generated with a bundler specified.
 
 ```shell
-nx g @nrwl/js:lib my-buildable-lib --buildable
+nx g @nrwl/js:lib my-buildable-lib --bundler=rollup
 ```
 
-Generating a library with `--buildable` will add a `build` target to the library's `project.json` file allows the library to be built.
+Generating a library with `--bundler` specified will add a `build` target to the library's `project.json` file allows the library to be built.
 
 ```shell
 nx build my-buildable-lib
@@ -95,7 +95,7 @@ Currently, `@nrwl/js` supports the following compilers:
 - Create a buildable library with `swc`
 
 ```shell
-nx g @nrwl/js:lib my-swc-lib --compiler=swc --buildable
+nx g @nrwl/js:lib my-swc-lib --bundler=swc
 ```
 
 - Convert a `tsc` library to use `swc`

docs/generated/packages/js/generators/library.json

@@ -89,7 +89,7 @@
         "type": "boolean",
         "default": true,
         "description": "Generate a buildable library.",
-        "x-priority": "important"
+        "x-deprecated": "Use the `bundler` option for greater control (swc, tsc, rollup, vite, esbuild, none)."
       },
       "setParserOptionsProject": {
         "type": "boolean",
@@ -108,13 +108,14 @@
         "enum": ["tsc", "swc"],
         "default": "tsc",
         "description": "The compiler used by the build and test targets",
-        "x-priority": "important"
+        "x-deprecated": "Use the `bundler` option for greater control (swc, tsc, rollup, vite, esbuild, none)."
       },
       "bundler": {
-        "description": "The bundler to use.",
+        "description": "The bundler to use. Choosing 'none' means this library is not buildable.",
         "type": "string",
-        "enum": ["none", "esbuild", "rollup", "vite"],
+        "enum": ["swc", "tsc", "rollup", "vite", "esbuild", "none"],
         "default": "none",
+        "x-prompt": "Which bundler would you like to use to build the library? Choose 'none' to skip build setup.",
         "x-priority": "important"
       },
       "skipTypeCheck": {
@@ -124,7 +125,7 @@
       }
     },
     "required": ["name"],
-    "examplesFile": "## Examples\n\n{% tabs %}\n\n{% tab label=\"Using directory flag\" %}\n\nGenerate a library named `mylib` and put it under a directory named `myapp` (`libs/myapp/mylib`)\n\n```shell\nnpx nx g lib mylib --directory=myapp\n```\n\n{% /tab %}\n\n{% tab label=\"Use SWC compiler\" %}\n\nGenerate a library using [SWC](https://swc.rs) as the compiler\n\n```shell\nnpx nx g lib mylib --compiler=swc\n```\n\n{% /tab %}\n\n{% tab label=\"Minimal publishing target\" %}\n\nGenerate a **publishable** library with a minimal publishing target\n\n```shell\nnpx nx g lib mylib --publishable\n```\n\n{% /tab %}\n\n{% /tabs %}\n",
+    "examplesFile": "---\ntitle: JS library generator examples\ndescription: This page contains examples for the @nrwl/js:lib generator.\n---\n\nThe `@nrwl/js:lib` generator will generate a library for you, and it will configure it according to the options you provide.\n\n```bash\nnpx nx g @nrwl/js:lib mylib\n```\n\nBy default, the library that is generated when you use this executor without passing any options, like the example above, will be a buildable library, using the `@nrwl/js:tsc` executor as a builder.\n\nYou may configure the tools you want to use to build your library, or bundle it too, by passing the `--bundler` flag. The `--bundler` flag controls the compiler and/or the bundler that will be used to build your library. If you choose `tsc` or `swc`, the result will be a buildable library using either `tsc` or `swc` as the compiler. If you choose `rollup` or `vite`, the result will be a buildable library using `rollup` or `vite` as the bundler. In the case of `rollup`, it will default to the `tsc` compiler. If you choose `esbuild`, you may use the [`esbuildOptions` property](https://esbuild.github.io/api/) in your `project.json` under the `build` target options to specify whether you wish to bundle your library or not.\n\n## Examples\n\n{% tabs %}\n\n{% tab label=\"Buildable with default compiler (tsc)\" %}\n\nGenerate a buildable library using the `@nrwl/js:tsc` executor. This uses `tsc` as the compiler.\n\n```bash\nnpx nx g @nrwl/js:lib mylib\n```\n\n{% /tab %}\n\n{% tab label=\"Buildable with SWC compiler\" %}\n\nGenerate a buildable library using [SWC](https://swc.rs) as the compiler. This will use the `@nrwl/js:swc` executor.\n\n```bash\nnpx nx g @nrwl/js:lib mylib --bundler=swc\n```\n\n{% /tab %}\n\n{% tab label=\"Buildable with tsc\" %}\n\nGenerate a buildable library using tsc as the compiler. This will use the `@nrwl/js:tsc` executor.\n\n```bash\nnpx nx g @nrwl/js:lib mylib --bundler=tsc\n```\n\n{% /tab %}\n\n{% tab label=\"Buildable, with Rollup as a bundler\" %}\n\nGenerate a buildable library using [Rollup](https://rollupjs.org) as the bundler. This will use the `@nrwl/rollup:rollup` executor. It will also use [SWC](https://swc.rs) as the compiler.\n\n```bash\nnpx nx g @nrwl/js:lib mylib --bundler=rollup\n```\n\nIf you do not want to use `swc` as the compiler, and want to use the default `babel` compiler, you can do so in your `project.json` under the `build` target options, using the [`compiler` property](https://nx.dev/packages/rollup/executors/rollup#compiler):\n\n```jsonc {% fileName=\"libs/mylib/project.json\" %}\n\"build\": {\n  \"executor\": \"@nrwl/rollup:rollup\",\n  \"options\": {\n    //...\n    \"compiler\": \"babel\"\n  }\n}\n```\n\n{% /tab %}\n\n{% tab label=\"Buildable, with Vite as a bundler\" %}\n\nGenerate a buildable library using [Vite](https://vitejs.dev/) as the bundler. This will use the `@nrwl/vite:build` executor.\n\n```bash\nnpx nx g @nrwl/js:lib mylib --bundler=vite\n```\n\n{% /tab %}\n\n{% tab label=\"Using ESBuild\" %}\n\nGenerate a buildable library using [ESBuild](https://esbuild.github.io/) as the bundler. This will use the `@nrwl/esbuild:esbuild` executor.\n\n```bash\nnpx nx g @nrwl/js:lib mylib --bundler=esbuild\n```\n\nIf you want to specify whether you want to bundle your library or not, you can do so in your `project.json` under the `build` target options, using the [`esbuildOptions` property](https://esbuild.github.io/api/):\n\n```jsonc {% fileName=\"libs/mylib/project.json\" %}\n\"build\": {\n  \"executor\": \"@nrwl/esbuild:esbuild\",\n  \"options\": {\n    //...\n    \"esbuildOptions\": {\n        \"bundle\": true\n    }\n  }\n}\n```\n\n{% /tab %}\n\n{% tab label=\"Minimal publishing target\" %}\n\nGenerate a **publishable** library with a minimal publishing target. The result will be a buildable library using the `@nrwl/js:tsc` executor, using `tsc` as the compiler. You can change the compiler or the bundler by passing the `--bundler` flag.\n\n```bash\nnpx nx g lib mylib --publishable\n```\n\n{% /tab %}\n\n{% tab label=\"Using directory flag\" %}\n\nGenerate a library named `mylib` and put it under a directory named `myapp` (`libs/myapp/mylib`)\n\n```shell\nnpx nx g lib mylib --directory=myapp\n```\n\n{% /tab %}\n\n{% /tabs %}\n",
     "presets": []
   },
   "aliases": ["lib"],

docs/shared/packages/js/js-plugin.md

@@ -54,13 +54,13 @@ nx g @nrwl/js:lib my-lib
 
 ## Build
 
-You can `build` libraries that are generated with `--buildable` flag.
+You can `build` libraries that are generated with a bundler specified.
 
 ```shell
-nx g @nrwl/js:lib my-buildable-lib --buildable
+nx g @nrwl/js:lib my-buildable-lib --bundler=rollup
 ```
 
-Generating a library with `--buildable` will add a `build` target to the library's `project.json` file allows the library to be built.
+Generating a library with `--bundler` specified will add a `build` target to the library's `project.json` file allows the library to be built.
 
 ```shell
 nx build my-buildable-lib
@@ -95,7 +95,7 @@ Currently, `@nrwl/js` supports the following compilers:
 - Create a buildable library with `swc`
 
 ```shell
-nx g @nrwl/js:lib my-swc-lib --compiler=swc --buildable
+nx g @nrwl/js:lib my-swc-lib --bundler=swc
 ```
 
 - Convert a `tsc` library to use `swc`

e2e/esbuild/src/esbuild.test.ts

@@ -101,7 +101,7 @@ describe('EsBuild Plugin', () => {
     const parentLib = uniq('parent-lib');
     const childLib = uniq('child-lib');
     runCLI(`generate @nrwl/js:lib ${parentLib} --bundler=esbuild`);
-    runCLI(`generate @nrwl/js:lib ${childLib} --buildable=false`);
+    runCLI(`generate @nrwl/js:lib ${childLib} --bundler=none`);
     updateFile(
       `libs/${parentLib}/src/index.ts`,
       `

e2e/js/src/js-inlining.test.ts

@@ -19,35 +19,39 @@ describe('inlining', () => {
   afterEach(() => cleanupProject());
 
   it.each(['tsc', 'swc'])(
-    'should inline libraries with --compiler=%s',
-    async (compiler) => {
+    'should inline libraries with --bundler=%s',
+    async (bundler) => {
       const parent = uniq('parent');
       runCLI(
-        `generate @nrwl/js:lib ${parent} --compiler=${compiler} --no-interactive`
+        `generate @nrwl/js:lib ${parent} --bundler=${bundler} --no-interactive`
       );
 
       const buildable = uniq('buildable');
-      runCLI(`generate @nrwl/js:lib ${buildable} --no-interactive`);
+      runCLI(
+        `generate @nrwl/js:lib ${buildable} --bundler=${bundler} --no-interactive`
+      );
 
       const buildableTwo = uniq('buildabletwo');
-      runCLI(`generate @nrwl/js:lib ${buildableTwo} --no-interactive`);
+      runCLI(
+        `generate @nrwl/js:lib ${buildableTwo} --bundler=${bundler} --no-interactive`
+      );
 
       const nonBuildable = uniq('nonbuildable');
       runCLI(
-        `generate @nrwl/js:lib ${nonBuildable} --buildable=false --no-interactive`
+        `generate @nrwl/js:lib ${nonBuildable} --bundler=none --no-interactive`
       );
 
       updateFile(`libs/${parent}/src/lib/${parent}.ts`, () => {
         return `
-import { ${buildable} } from '@${scope}/${buildable}';
-import { ${buildableTwo} } from '@${scope}/${buildableTwo}';
-import { ${nonBuildable} } from '@${scope}/${nonBuildable}';
-
-export function ${parent}() {
-  ${buildable}();
-  ${buildableTwo}();
-  ${nonBuildable}();
-}
+          import { ${buildable} } from '@${scope}/${buildable}';
+          import { ${buildableTwo} } from '@${scope}/${buildableTwo}';
+          import { ${nonBuildable} } from '@${scope}/${nonBuildable}';
+
+          export function ${parent}() {
+            ${buildable}();
+            ${buildableTwo}();
+            ${nonBuildable}();
+          }
         `;
       });
 
@@ -98,33 +102,33 @@ export function ${parent}() {
 
   it('should inline nesting libraries', async () => {
     const parent = uniq('parent');
-    runCLI(`generate @nrwl/js:lib ${parent} --no-interactive`);
+    runCLI(`generate @nrwl/js:lib ${parent} --bundler=tsc --no-interactive`);
 
     const child = uniq('child');
-    runCLI(`generate @nrwl/js:lib ${child} --buildable=false --no-interactive`);
+    runCLI(`generate @nrwl/js:lib ${child} --bundler=none --no-interactive`);
 
     const grandChild = uniq('grandchild');
     runCLI(
-      `generate @nrwl/js:lib ${grandChild} --buildable=false --no-interactive`
+      `generate @nrwl/js:lib ${grandChild} --bundler=none --no-interactive`
     );
 
     updateFile(`libs/${parent}/src/lib/${parent}.ts`, () => {
       return `
-import { ${child} } from '@${scope}/${child}';
+        import { ${child} } from '@${scope}/${child}';
 
-export function ${parent}() {
-  ${child}();
-}
+        export function ${parent}() {
+          ${child}();
+        }
         `;
     });
 
     updateFile(`libs/${child}/src/lib/${child}.ts`, () => {
       return `
-import { ${grandChild} } from '@${scope}/${grandChild}';
+        import { ${grandChild} } from '@${scope}/${grandChild}';
 
-export function ${child}() {
-  ${grandChild}();
-}
+        export function ${child}() {
+          ${grandChild}();
+        }
         `;
     });
 

e2e/js/src/js-swc.test.ts

@@ -27,11 +27,10 @@ describe('js e2e', () => {
     cleanupProject();
   });
 
-  it('should create libs with js executors (--compiler=swc)', async () => {
+  it('should create libs with js executors (--bundler=swc)', async () => {
     const lib = uniq('lib');
-    runCLI(
-      `generate @nrwl/js:lib ${lib} --buildable --compiler=swc --no-interactive`
-    );
+    runCLI(`generate @nrwl/js:lib ${lib} --bundler=swc --no-interactive`);
+
     const libPackageJson = readJson(`libs/${lib}/package.json`);
     expect(libPackageJson.scripts).toBeUndefined();
 
@@ -49,9 +48,7 @@ describe('js e2e', () => {
     checkFilesDoNotExist(`libs/${lib}/.babelrc`);
 
     const parentLib = uniq('parentlib');
-    runCLI(
-      `generate @nrwl/js:lib ${parentLib} --buildable --compiler=swc --no-interactive`
-    );
+    runCLI(`generate @nrwl/js:lib ${parentLib} --bundler=swc --no-interactive`);
     const parentLibPackageJson = readJson(`libs/${parentLib}/package.json`);
     expect(parentLibPackageJson.scripts).toBeUndefined();
     expect((await runCLIAsync(`test ${parentLib}`)).combinedOutput).toContain(
@@ -123,7 +120,7 @@ describe('js e2e', () => {
 
   it('should handle swcrc path mappings', async () => {
     const lib = uniq('lib');
-    runCLI(`generate @nrwl/js:lib ${lib} --compiler=swc --no-interactive`);
+    runCLI(`generate @nrwl/js:lib ${lib} --bundler=swc --no-interactive`);
 
     // add a dummy x.ts file for path mappings
     updateFile(

e2e/js/src/js-tsc.test.ts

@@ -28,9 +28,7 @@ describe('js e2e', () => {
 
   it('should create libs with js executors (--compiler=tsc)', async () => {
     const lib = uniq('lib');
-    runCLI(
-      `generate @nrwl/js:lib ${lib} --buildable --compiler=tsc --no-interactive`
-    );
+    runCLI(`generate @nrwl/js:lib ${lib} --bundler=tsc --no-interactive`);
     const libPackageJson = readJson(`libs/${lib}/package.json`);
     expect(libPackageJson.scripts).toBeUndefined();
 
@@ -90,9 +88,7 @@ describe('js e2e', () => {
     libBuildProcess.kill();
 
     const parentLib = uniq('parentlib');
-    runCLI(
-      `generate @nrwl/js:lib ${parentLib} --buildable --compiler=tsc --no-interactive`
-    );
+    runCLI(`generate @nrwl/js:lib ${parentLib} --bundler=tsc --no-interactive`);
     const parentLibPackageJson = readJson(`libs/${parentLib}/package.json`);
     expect(parentLibPackageJson.scripts).toBeUndefined();
     expect((await runCLIAsync(`test ${parentLib}`)).combinedOutput).toContain(
@@ -173,9 +169,7 @@ describe('package.json updates', () => {
   it('should update package.json with detected dependencies', async () => {
     const pmc = getPackageManagerCommand();
     const lib = uniq('lib');
-    runCLI(
-      `generate @nrwl/js:lib ${lib} --buildable --compiler=tsc --no-interactive`
-    );
+    runCLI(`generate @nrwl/js:lib ${lib} --bundler=tsc --no-interactive`);
 
     // Add a dependency for this lib to check the built package.json
     runCommand(`${pmc.addProd} react`);

e2e/js/src/js.test.ts

@@ -37,10 +37,10 @@ describe('js e2e', () => {
 
   it('should allow wildcard ts path alias', async () => {
     const base = uniq('base');
-    runCLI(`generate @nrwl/js:lib ${base} --buildable --no-interactive`);
+    runCLI(`generate @nrwl/js:lib ${base} --bundler=tsc --no-interactive`);
 
     const lib = uniq('lib');
-    runCLI(`generate @nrwl/js:lib ${lib} --buildable --no-interactive`);
+    runCLI(`generate @nrwl/js:lib ${lib} --bundler=tsc --no-interactive`);
 
     updateFile(`libs/${base}/src/index.ts`, () => {
       return `

e2e/node/src/node.test.ts

@@ -306,7 +306,7 @@ describe('Build Node apps', () => {
     runCLI(`generate @nrwl/node:app ${nodeapp} --bundler=webpack`);
 
     const jslib = uniq('jslib');
-    runCLI(`generate @nrwl/js:lib ${jslib} --buildable`);
+    runCLI(`generate @nrwl/js:lib ${jslib} --bundler=tsc`);
 
     updateFile(
       `apps/${nodeapp}/src/main.ts`,

e2e/nx-run/src/affected-graph.test.ts

@@ -35,8 +35,8 @@ describe('Nx Affected and Graph Tests', () => {
       const mypublishablelib = uniq('mypublishablelib');
       runCLI(`generate @nrwl/web:app ${myapp}`);
       runCLI(`generate @nrwl/web:app ${myapp2}`);
-      runCLI(`generate @nrwl/js:lib ${mylib}`);
-      runCLI(`generate @nrwl/js:lib ${mylib2}`);
+      runCLI(`generate @nrwl/js:lib ${mylib} --bundler=tsc`);
+      runCLI(`generate @nrwl/js:lib ${mylib2} --bundler=tsc`);
       runCLI(
         `generate @nrwl/js:lib ${mypublishablelib} --publishable --importPath=@${proj}/${mypublishablelib}`
       );
@@ -195,7 +195,7 @@ describe('Nx Affected and Graph Tests', () => {
     function generateAll() {
       runCLI(`generate @nrwl/web:app ${myapp}`);
       runCLI(`generate @nrwl/web:app ${myapp2}`);
-      runCLI(`generate @nrwl/js:lib ${mylib}`);
+      runCLI(`generate @nrwl/js:lib ${mylib} --bundler=tsc`);
       runCommand(`git add . && git commit -am "add all"`);
     }
 
@@ -211,7 +211,7 @@ describe('Nx Affected and Graph Tests', () => {
         expect(runCLI('affected:apps')).toContain(myapp2);
         runCommand(`git add . && git commit -am "add ${myapp2}"`);
 
-        runCLI(`generate @nrwl/js:lib ${mylib}`);
+        runCLI(`generate @nrwl/js:lib ${mylib} --bundler=tsc`);
         expect(runCLI('affected:apps')).not.toContain(myapp);
         expect(runCLI('affected:apps')).not.toContain(myapp2);
         expect(runCLI('affected:libs')).toContain(mylib);
@@ -294,8 +294,8 @@ describe('Nx Affected and Graph Tests', () => {
 
       runCLI(`generate @nrwl/web:app ${myapp}`);
       runCLI(`generate @nrwl/web:app ${myapp2}`);
-      runCLI(`generate @nrwl/js:lib ${mylib}`);
-      runCLI(`generate @nrwl/js:lib ${mylib2}`);
+      runCLI(`generate @nrwl/js:lib ${mylib} --bundler=tsc`);
+      runCLI(`generate @nrwl/js:lib ${mylib2} --bundler=tsc`);
       runCLI(`generate @nrwl/js:lib ${mypublishablelib}`);
 
       const app1ElementSpec = readFile(
@@ -413,8 +413,8 @@ describe('Nx Affected and Graph Tests', () => {
       runCLI(`generate @nrwl/web:app ${myapp}`);
       runCLI(`generate @nrwl/web:app ${myapp2}`);
       runCLI(`generate @nrwl/web:app ${myapp3}`);
-      runCLI(`generate @nrwl/js:lib ${mylib}`);
-      runCLI(`generate @nrwl/js:lib ${mylib2}`);
+      runCLI(`generate @nrwl/js:lib ${mylib} --bundler=tsc`);
+      runCLI(`generate @nrwl/js:lib ${mylib2} --bundler=tsc`);
 
       runCommand(`git init`);
       runCommand(`git config user.email "test@test.com"`);

e2e/nx-run/src/run.test.ts

@@ -439,9 +439,9 @@ describe('Nx Running Tests', () => {
       const libD = uniq('libd-rand');
 
       runCLI(`generate @nrwl/web:app ${appA}`);
-      runCLI(`generate @nrwl/js:lib ${libA} --buildable --defaults`);
-      runCLI(`generate @nrwl/js:lib ${libB} --buildable --defaults`);
-      runCLI(`generate @nrwl/js:lib ${libC} --buildable --defaults`);
+      runCLI(`generate @nrwl/js:lib ${libA} --bundler=tsc --defaults`);
+      runCLI(`generate @nrwl/js:lib ${libB} --bundler=tsc --defaults`);
+      runCLI(`generate @nrwl/js:lib ${libC} --bundler=tsc --defaults`);
       runCLI(`generate @nrwl/node:lib ${libD} --defaults`);
 
       // libA depends on libC

e2e/rollup/src/rollup.test.ts

@@ -15,7 +15,7 @@ describe('Rollup Plugin', () => {
 
   it('should be able to setup project to build node programs with rollup and different compilers', async () => {
     const myPkg = uniq('my-pkg');
-    runCLI(`generate @nrwl/js:lib ${myPkg} --buildable=false`);
+    runCLI(`generate @nrwl/js:lib ${myPkg} --bundler=none`);
     updateFile(`libs/${myPkg}/src/index.ts`, `console.log('Hello');\n`);
 
     // babel (default)

e2e/webpack/src/webpack.test.ts

@@ -1,7 +1,6 @@
 import {
   cleanupProject,
   newProject,
-  readFile,
   rmDist,
   runCLI,
   runCommand,
@@ -16,7 +15,7 @@ describe('Webpack Plugin', () => {
 
   it('should be able to setup project to build node programs with webpack and different compilers', async () => {
     const myPkg = uniq('my-pkg');
-    runCLI(`generate @nrwl/js:lib ${myPkg} --buildable=false`);
+    runCLI(`generate @nrwl/js:lib ${myPkg} --bundler=none`);
     updateFile(`libs/${myPkg}/src/index.ts`, `console.log('Hello');\n`);
 
     // babel (default)

packages/cypress/src/generators/cypress-project/cypress-project.ts

@@ -21,10 +21,7 @@ import {
 } from '@nrwl/devkit';
 import { Linter, lintProjectGenerator } from '@nrwl/linter';
 import { runTasksInSerial } from '@nrwl/workspace/src/utilities/run-tasks-in-serial';
-import {
-  initGenerator as jsInitGenerator,
-  getRelativePathToRootTsConfig,
-} from '@nrwl/js';
+import { getRelativePathToRootTsConfig } from '@nrwl/js';
 import {
   globalJavaScriptOverrides,
   globalTypeScriptOverrides,