or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

build-system.mdcommands.mdconfiguration.mdindex.mdutilities.md
tile.json

tessl/npm-vant--cli

A comprehensive TypeScript CLI tool for building Vue component libraries with development server, build pipeline, and documentation generation.

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@vant/cli@7.1.x

To install, run

npx @tessl/cli install tessl/npm-vant--cli@7.1.0

index.mddocs/

Vant CLI

Vant CLI is a comprehensive TypeScript CLI tool for building Vue component libraries. It provides a complete development workflow from initial setup to deployment, featuring automatic documentation generation, component building, theme customization support, and tree-shaking optimization.

Package Information

  • Package Name: @vant/cli
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install -g @vant/cli or use with npx @vant/cli
  • Node Requirements: >=16.0.0

Core Imports

Primary usage as CLI tool:

npx vant-cli <command>

For programmatic access to version information:

import { cliVersion } from "@vant/cli";

For CommonJS:

const { cliVersion } = require("@vant/cli");

Basic Usage

# Start development server
vant-cli dev

# Build production package
vant-cli build

# Clean build artifacts
vant-cli clean

# Lint source code
vant-cli lint

# Build documentation site
vant-cli build-site

# Release package
vant-cli release --tag latest --gitTag

For version information:

import { cliVersion } from "@vant/cli";
console.log(`Vant CLI version: ${cliVersion}`);

Architecture

Vant CLI is built around several key components:

  • CLI Commands: Seven main commands for development, building, and maintenance workflows
  • Build System: Rsbuild-based compilation with multi-format output (ES modules, CommonJS, UMD)
  • Development Server: Hot-reload development server for documentation sites
  • Compiler Pipeline: Comprehensive Vue SFC, TypeScript, and CSS compilation
  • Configuration System: Flexible configuration via vant.config.mjs files
  • Package Management: Automated dependency installation and release workflows

Capabilities

CLI Commands

Primary interface for Vue component library development workflows including development server, production builds, and maintenance tasks.

# Development server
vant-cli dev

# Production builds
vant-cli build
vant-cli build-site

# Maintenance
vant-cli clean
vant-cli lint

# Publishing
vant-cli release [--tag <tag>] [--gitTag]

# Utilities  
vant-cli commit-lint <gitParams>

CLI Commands

Version Information

Access to CLI version information for programmatic use.

// Version access
const cliVersion: string;

Core Utilities

Essential utilities for file operations, path manipulation, and component analysis used throughout the build system.

// File type detection utilities (internal APIs)
function isSfc(path: string): boolean;
function isStyle(path: string): boolean;
function isScript(path: string): boolean;
function isAsset(path: string): boolean;

// String transformation utilities (internal APIs)
function camelize(str: string): string;
function pascalize(str: string): string;
function decamelize(str: string, sep?: string): string;

// Component analysis utilities (internal APIs)
function getComponents(): string[];
function hasExportOrDefineOptions(code: string): boolean;

Core Utilities

Build System

Compilation system for Vue Single File Components, TypeScript, and CSS with multi-format output support.

// SFC compilation
interface SFCDescriptor {
  template?: { content: string; };
  script?: { content: string; };
  styles: Array<{ content: string; }>;
}
function parseSfc(filename: string): SFCDescriptor;
function compileSfc(filePath: string): Promise<any>;

// Style compilation
function compileStyle(filePath: string): Promise<void>;

// Bundle configuration
interface BundleOption {
  minify?: boolean;
  formats: LibraryFormats[];
  external?: string[];
}
function compileBundles(): Promise<void>;

Build System

Configuration System

Configuration management for build settings, site generation, and development workflows.

// Configuration access
interface VantConfig {
  name?: string;
  build?: BuildConfig;
  site?: SiteConfig;
}

interface BuildConfig {
  srcDir?: string;
  tagPrefix?: string;
  namedExport?: boolean;
  packageManager?: 'npm' | 'yarn' | 'pnpm';
  css?: CSSConfig;
  configureVite?: (config: InlineConfig) => InlineConfig | void;
}

function getVantConfig(): VantConfig;
function getPackageJson(): object;

Configuration

Types

// Version information (public export)
const cliVersion: string;

// Command-line options for release command
interface ReleaseCommandOptions {
  tag?: string;     // npm tag (beta, alpha, rc, latest)
  gitTag?: boolean; // create git tag
}

// Configuration file interface (vant.config.mjs)
interface VantConfig {
  name?: string;
  build?: {
    srcDir?: string;
    tagPrefix?: string;
    namedExport?: boolean;
    skipInstall?: string[];
    packageManager?: 'npm' | 'yarn' | 'pnpm';
    extensions?: {
      esm?: string;
    };
    bundleOptions?: BundleOption[];
    css?: {
      preprocessor?: 'css' | 'less' | 'sass';
      base?: string;
      removeSourceFile?: boolean;
    };
    configureVite?: (config: InlineConfig) => InlineConfig | void;
  };
  site?: {
    defaultLang?: string;
    darkModeClass?: string;
    lightModeClass?: string;
    enableVConsole?: boolean;
    versions?: Array<{ label: string; link: string }>;
    locales?: Record<string, LocaleConfig>;
  };
}

// Bundle configuration (internal)
interface BundleOption {
  minify?: boolean;
  formats: LibraryFormats[];
  external?: string[];
}

// Locale configuration for site
interface LocaleConfig {
  title?: string;
  description?: string;
  lang?: string;
  nav?: Array<{
    title: string;
    items?: Array<{
      path: string;
      title: string;
    }>;
  }>;
}