tessl/npm-remix-run--dev

Dev tools and CLI for Remix applications providing build tools, development server, Vite integration, and command-line utilities.

—

Pending

Overview

Eval results

Files

CLI Commands

Name: tessl/npm-remix-run--dev
Author: tessl

Complete command-line interface for Remix project management including project initialization, development server, build system, and route inspection.

Capabilities

CLI Runner

Main CLI entry point that processes command-line arguments and executes appropriate commands.

/**
 * Main CLI runner function that processes command-line arguments
 * Access via: import * as cli from "@remix-run/dev"
 * @returns Promise that resolves when CLI execution completes
 */
function run(): Promise<void>;

Project Initialization

Initialize a new Remix project by running the remix.init script if present.

/**
 * Initialize Remix project with remix.init script
 * @param projectDir - Directory containing the project
 * @param options - Initialization options
 * @returns Promise that resolves when initialization completes
 */
function init(projectDir: string, options?: InitFlags): Promise<void>;

interface InitFlags {
  /** Whether to delete the remix.init script after execution */
  deleteScript?: boolean;
}

Usage Example:

# Initialize project in current directory
npx remix init

# Initialize project in specific directory
npx remix init ./my-project

# Initialize without deleting remix.init script
npx remix init --no-delete

Route Information

Display route information in various formats for debugging and documentation.

/**
 * Display route information for the Remix project
 * @param remixRoot - Root directory of Remix project
 * @param flags - Route display options
 * @returns Promise that resolves when route information is displayed
 */
function routes(remixRoot?: string, flags?: RoutesFlags): Promise<void>;

interface RoutesFlags {
  /** Path to configuration file */
  config?: string;
  /** Output routes as JSON */
  json?: boolean;
}

Usage Examples:

# Display routes as tree structure
npx remix routes

# Output routes as JSON
npx remix routes --json

# Use specific config file
npx remix routes --config vite.config.dev.ts

Development Commands

Start development server and build processes for local development.

# Modern Vite-based development (recommended)
npx remix vite:dev [projectDir]

# Modern Vite-based build (recommended)
npx remix vite:build [projectDir]

# Legacy development server
npx remix dev [projectDir]

# Legacy build system
npx remix build [projectDir]

# Watch mode for development
npx remix watch [projectDir]

Build Commands

Production build commands for creating optimized bundles.

/**
 * Build production bundles using the compiler
 * @param remixRoot - Root directory of Remix project
 * @param mode - Build mode (development/production)
 * @param sourcemap - Generate source maps
 * @returns Promise that resolves when build completes
 */
function build(remixRoot: string, mode?: string, sourcemap?: boolean): Promise<void>;

/**
 * Build production bundles using Vite
 * @param root - Root directory of project
 * @param options - Vite build options
 * @returns Promise that resolves when build completes
 */
function viteBuild(root?: string, options?: ViteBuildOptions): Promise<void>;

interface ViteBuildOptions {
  assetsInlineLimit?: number;
  clearScreen?: boolean;
  config?: string;
  emptyOutDir?: boolean;
  logLevel?: "info" | "warn" | "error" | "silent";
  minify?: boolean | "terser" | "esbuild";
  mode?: string;
  profile?: boolean;
  sourcemap?: boolean | "inline" | "hidden";
  target?: string | string[];
  watch?: object;
}

Development Server Commands

Start development servers with live reload and HMR capabilities.

/**
 * Start development server
 * @param remixRoot - Root directory of Remix project
 * @param flags - Development server options
 * @returns Promise that resolves when server stops
 */
function dev(remixRoot: string, flags?: DevFlags): Promise<void>;

/**
 * Start Vite development server
 * @param root - Root directory of project
 * @param options - Vite development options
 * @returns Promise that resolves when server stops
 */
function viteDev(root: string, options?: ViteDevOptions): Promise<void>;

/**
 * Watch for changes and rebuild
 * @param remixRootOrConfig - Root directory or config object
 * @param mode - Build mode
 * @returns Promise that resolves when watch stops
 */
function watch(remixRootOrConfig: string | RemixConfig, mode?: string): Promise<void>;

interface DevFlags {
  /** Custom command to run */
  command?: string;
  /** Manual mode - don't auto-restart on changes */
  manual?: boolean;
  /** Development server port */
  port?: number;
  /** Path to TLS key file */
  tlsKey?: string;
  /** Path to TLS certificate file */
  tlsCert?: string;
}

interface ViteDevOptions {
  clearScreen?: boolean;
  config?: string;
  cors?: boolean;
  force?: boolean;
  host?: string | boolean;
  logLevel?: "info" | "warn" | "error" | "silent";
  mode?: string;
  open?: boolean | string;
  port?: number;
  profile?: boolean;
  strictPort?: boolean;
}

Watch Mode

Continuous compilation during development with file watching. The watch function is already defined above in the Development Server Commands section.

Entry File Generation

Generate entry files for client and server sides of Remix applications.

/**
 * Generate entry files for Remix applications
 * @param entry - Entry type ("entry.client" | "entry.server" | "" for both)
 * @param remixRoot - Root directory of Remix project
 * @param flags - Generation options
 * @returns Promise that resolves when generation completes
 */
function generateEntry(entry: string, remixRoot: string, flags?: GenerateEntryFlags): Promise<void>;

interface GenerateEntryFlags {
  /** Generate TypeScript files */
  typescript?: boolean;
  /** Path to configuration file */
  config?: string;
}

Utility Commands

Additional CLI utilities for project management.

/**
 * Setup command (deprecated in v2, no-op)
 * @deprecated No longer necessary as of v2
 */
function setup(): void;

CLI Options

Global CLI options available across all commands:

--help, -h - Print help message and exit
--version, -v - Print CLI version and exit
--no-color - Disable ANSI colors in console output

Vite Build Options

Options passed through to Vite for vite:build command:

--assetsInlineLimit - Static asset base64 inline threshold (default: 4096)
--clearScreen - Allow/disable clear screen when logging
--config, -c - Use specified config file
--emptyOutDir - Force empty outDir when outside of root
--logLevel, -l - Log level: info | warn | error | silent
--minify - Enable/disable minification (default: "esbuild")
--mode, -m - Set env mode
--profile - Start built-in Node.js inspector
--sourcemapClient - Output source maps for client build
--sourcemapServer - Output source maps for server build

Vite Dev Options

Options passed through to Vite for vite:dev command:

--clearScreen - Allow/disable clear screen when logging
--config, -c - Use specified config file
--cors - Enable CORS
--force - Force optimizer to ignore cache
--host - Specify hostname
--logLevel, -l - Log level: info | warn | error | silent
--mode, -m - Set env mode
--open - Open browser on startup
--port - Specify port
--profile - Start built-in Node.js inspector
--strictPort - Exit if specified port is in use

Usage Examples:

# Development with custom port and host
npx remix vite:dev --port 4000 --host 0.0.0.0

# Production build with source maps
npx remix vite:build --sourcemapClient --sourcemapServer

# Build with custom config
npx remix vite:build --config vite.config.prod.ts

# Development with debugging
npx remix dev --port 3001 --debug

# Watch mode with specific server mode
npx remix watch --mode production

Install with Tessl CLI