Slice.js CLI

Installation

• Local (recommended):

npm install slicejs-cli --save-dev

• Global:

npm install -g slicejs-cli

Usage

After installation, you can use the slice command directly:

slice [command] [options]

Or with npx (without global install):

npx slicejs-cli [command]

Essential Commands

Initialize a project

slice init

Initializes a Slice.js project with the full structure (src/ and api/), installs initial Visual components, and configures npm scripts.

Development server

# Default port (3000)
slice dev

# Custom port
slice dev -p 8080

# Alias
slice start
slice start -p 8080

Component management (local)

# Create a component (interactive)
slice component create

# List local components
slice component list

# Delete a component (interactive)
slice component delete

Shortcuts:

slice comp create
slice comp ls
slice comp remove

Official component registry

# Install Visual components
slice get Button Card Input

# Install a Service component
slice get FetchManager --service

# Force overwrite
slice get Button --force

# Browse available components
slice browse

# Update all local components
slice sync
slice sync --force

Shortcuts:

slice get Button
slice browse
slice sync

Utilities

# Version info
slice version
slice -v

# Updates (CLI and Framework)
slice update              # Check and prompt to update
slice update --yes        # Update everything automatically
slice update --cli        # CLI only
slice update --framework  # Framework only

# Help
slice --help
slice [command] --help

npm Scripts

slice init automatically configures the recommended scripts in your package.json:

{
  "scripts": {
    "dev": "slice dev",
    "start": "slice start",
    "get": "slice get",
    "browse": "slice browse",
    "sync": "slice sync",
    "component:create": "slice component create",
    "component:list": "slice component list",
    "component:delete": "slice component delete"
  }
}

Usage:

npm run dev
npm run get
npm run browse

Quick Start

# 1. Create a new project directory
mkdir my-slice-project
cd my-slice-project

# 2. Initialize npm and install Slice CLI
npm init -y
npm install slicejs-cli --save-dev

# 3. Initialize Slice.js project
slice init

# 4. Start development server
slice dev

# 5. Open browser at http://localhost:3000

Common Workflows

Starting a New Project

slice init
slice dev

Adding Components

# Browse available components
slice browse

# Install specific components
slice get Button Card Input

# Create custom component
slice component create

Keeping Components Updated

# Check what needs updating
slice browse

# Update all components
slice sync

Development Mode

The development server (slice dev / slice start) provides:

• ✅ Hot reload
• ✅ Serves directly from /src
• ✅ No build step
• ✅ Port validation
• ✅ Clear error messages

Requirements

• Node.js >= 20.0.0
• npm or yarn

Configuration

Project configuration is stored in src/sliceConfig.json and is created automatically by slice init.

Features

• 🚀 Development server with hot reload
• 📦 Official component registry
• 🎨 Visual and Service component types
• ✨ Interactive component creation
• 🔄 Automatic component synchronization
• 🛠️ Built-in validation and error handling

Smart Updates

• Detects whether the CLI in use is global or local
• Shows an update plan (GLOBAL/PROJECT) before execution
• Offers to include global CLI update interactively
• Applies uninstall + install @latest to ensure latest versions

Cross-platform Paths

• Centralized path helper avoids ../../..
• Windows/Linux/Mac compatibility using import.meta.url and fileURLToPath

Troubleshooting

Port already in use

# Use a different port
slice dev -p 8080

Project not initialized

# Make sure to run init first
slice init

Command not found

# Use npx if not installed globally
npx slicejs-cli dev

# Or install globally
npm install -g slicejs-cli

Links

• 📘 Documentation: https://slice-js-docs.vercel.app/
• 🐙 GitHub: https://github.com/VKneider/slice-cli
• 📦 npm: https://www.npmjs.com/package/slicejs-cli

License

ISC

Author

vkneider