or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

additional-utilities.mdasset-management.mdexecutors.mdgenerators.mdindex.mdpackage-management.mdtypescript-utilities.md
tile.json

tessl/npm-nx--js

The JS plugin for Nx contains executors and generators that provide the best experience for developing JavaScript and TypeScript projects.

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@nx/js@21.4.x

To install, run

npx @tessl/cli install tessl/npm-nx--js@21.4.0

index.mddocs/

@nx/js

The @nx/js plugin provides comprehensive tooling for developing JavaScript and TypeScript projects within Nx workspaces. It includes executors for building, running, and publishing JavaScript/TypeScript code, generators for scaffolding projects and configurations, and utilities for TypeScript compilation, package.json management, and asset handling.

Package Information

  • Package Name: @nx/js
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install @nx/js

Core Imports

import {
  // Generators
  libraryGenerator,
  initGenerator,
  setupPrettierGenerator,
  setupVerdaccio,
  // Package JSON utilities
  createPackageJson,
  updatePackageJson,
  createEntryPoints,
  // TypeScript utilities
  runTypeCheck,
  readTsConfig,
  createTsConfig,
  loadTsTransformers,
  printDiagnostics,
  getSourceNodes,
  // Asset handling
  copyAssets,
  assetGlobsToFiles,
  // Lock file utilities
  createLockFile,
  getLockFileName,
  // Other utilities
  addTslibDependencies,
  isValidVariable
} from "@nx/js";

For CommonJS:

const {
  libraryGenerator,
  initGenerator,
  setupPrettierGenerator,
  setupVerdaccio,
  createPackageJson,
  updatePackageJson,
  runTypeCheck,
  readTsConfig,
  copyAssets,
  createLockFile,
  getLockFileName
} = require("@nx/js");

Basic Usage

import { Tree } from "@nx/devkit";
import { libraryGenerator, updatePackageJson } from "@nx/js";

// Generate a new TypeScript library
await libraryGenerator(tree, {
  directory: 'libs/my-lib',
  name: 'my-lib',
  bundler: 'tsc',
  unitTestRunner: 'jest',
  linter: 'eslint'
});

// Update package.json for build output
updatePackageJson({
  outputPath: 'dist/libs/my-lib',
  main: './src/index.js',
  generatePackageJson: true
}, context, target, dependencies);

Architecture

The @nx/js plugin is built around several key components:

  • Generators: Project scaffolding tools for libraries, configurations, and setup
  • Executors: Build and runtime tools for TypeScript/SWC compilation, Node.js execution, and publishing
  • TypeScript Utilities: Comprehensive TypeScript compilation, type checking, and AST manipulation tools
  • Package Management: Package.json creation, updating, and dependency management utilities
  • Asset Handling: Static asset copying and processing capabilities
  • Build System Integration: Deep integration with Nx's caching, dependency graph, and task execution

Capabilities

Project Generation

Comprehensive project scaffolding with support for multiple bundlers, test runners, and configurations. Includes workspace initialization and library creation.

function libraryGenerator(
  tree: Tree,
  schema: LibraryGeneratorSchema
): Promise<GeneratorCallback>;

function initGenerator(
  tree: Tree,
  schema: InitSchema
): Promise<GeneratorCallback>;

Generators

Build Execution

High-performance executors for TypeScript compilation, SWC building, Node.js application running, and package publishing with full Nx integration.

function tscExecutor(
  options: ExecutorOptions,
  context: ExecutorContext
): AsyncGenerator<{ success: boolean; options?: Record<string, any> }>;

function swcExecutor(
  options: SwcExecutorOptions,
  context: ExecutorContext
): AsyncGenerator<{ success: boolean; options?: Record<string, any> }>;

Executors

TypeScript Compilation

Complete TypeScript toolchain including compilation, type checking, configuration management, and AST manipulation utilities.

function runTypeCheck(options: TypeCheckOptions): Promise<TypeCheckResult>;

function readTsConfig(tsConfigPath: string, sys?: ts.System): ts.ParsedCommandLine;

function loadTsTransformers(
  plugins: TransformerEntry[],
  moduleResolver?: typeof require.resolve
): { compilerPluginHooks: CompilerPluginHooks; hasPlugin: boolean; };

TypeScript Utilities

Package Management

Package.json creation, updating, and dependency management with support for exports fields, entry points, and build artifact integration.

function updatePackageJson(
  options: UpdatePackageJsonOption,
  context: ExecutorContext,
  target: ProjectGraphProjectNode,
  dependencies: DependentBuildableProjectNode[],
  fileMap?: ProjectFileMap
): void;

function createPackageJson(
  projectName: string,
  graph: ProjectGraph,
  options: CreatePackageJsonOptions
): PackageJson;

Package Management

Asset Handling

Static asset copying and processing with glob pattern support, output path management, and watch mode capabilities.

function copyAssets(
  options: CopyAssetsOptions,
  context: ExecutorContext
): Promise<CopyAssetsResult>;

function assetGlobsToFiles(
  assets: Array<AssetGlob | string>,
  rootDir: string,
  outDir: string
): FileInputOutput[];

Asset Management

Additional Utilities

Lock file management, local registry scripts, dependency handling, and other development utilities.

function copyPackageJson(
  options: CopyPackageJsonOptions,
  context: ExecutorContext
): Promise<CopyPackageJsonResult>;

function createLockFile(
  packageManager: 'npm' | 'yarn' | 'pnpm',
  workspaceRoot: string,
  projectRoot: string,
  packageJson: any
): Promise<void>;

function addLocalRegistryScripts(
  tree: Tree,
  options: LocalRegistryOptions
): void;

function isValidVariable(name: string): boolean;

Additional Utilities

Types

interface LibraryGeneratorSchema {
  directory: string;
  name?: string;
  skipFormat?: boolean;
  tags?: string;
  skipTsConfig?: boolean;
  skipPackageJson?: boolean;
  includeBabelRc?: boolean;
  unitTestRunner?: 'jest' | 'vitest' | 'none';
  linter?: Linter | LinterType;
  testEnvironment?: 'jsdom' | 'node';
  importPath?: string;
  js?: boolean;
  pascalCaseFiles?: boolean;
  strict?: boolean;
  publishable?: boolean;
  buildable?: boolean;
  setParserOptionsProject?: boolean;
  config?: 'workspace' | 'project' | 'npm-scripts';
  compiler?: Compiler;
  bundler?: Bundler;
  skipTypeCheck?: boolean;
  minimal?: boolean;
  rootProject?: boolean;
  simpleName?: boolean;
  addPlugin?: boolean;
  useProjectJson?: boolean;
  useTscExecutor?: boolean;
}

interface ExecutorOptions {
  assets: Array<AssetGlob | string>;
  main: string;
  rootDir?: string;
  outputPath: string;
  tsConfig: string;
  generateExportsField?: boolean;
  additionalEntryPoints?: string[];
  watch: boolean;
  clean?: boolean;
  transformers: TransformerEntry[];
  external?: 'all' | 'none' | string[];
  externalBuildTargets?: string[];
  generateLockfile?: boolean;
  generatePackageJson?: boolean;
  includeIgnoredAssetFiles?: boolean;
}

interface TypeCheckOptions {
  mode?: 'noEmit' | 'emitDeclarationOnly';
  tsConfigPath: string;
  workspaceRoot: string;
  incremental?: boolean;
  cacheDir?: string;
}

interface TypeCheckResult {
  warnings: string[];
  errors: string[];
  inputFilesCount: number;
  totalFilesCount: number;
  incremental: boolean;
}

type Compiler = 'tsc' | 'swc';
type Bundler = 'swc' | 'tsc' | 'rollup' | 'vite' | 'esbuild' | 'none';
type SupportedFormat = 'cjs' | 'esm';

interface FileInputOutput {
  input: string;
  output: string;
}

interface AssetGlob extends FileInputOutput {
  glob: string;
  ignore?: string[];
  dot?: boolean;
  includeIgnoredFiles?: boolean;
}