How can I use next-term in my existing Next.js project?
This post might have stale content, as main is 111 commits ahead.
how can i use this? i already have a nextjs project
Here's how to use next-term in your existing Next.js project:
##Installation
npm install next-term ink react-devtools-core
# or
pnpm add next-term ink react-devtools-core
# or
yarn add next-term ink react-devtools-core
Note:
inkis only needed if you want to build interactive React-based CLI UIs.
##Setup
###1. Add scripts to your package.json
{
"scripts": {
"dev": "next-term build && next dev",
"build": "next-term build && next build",
"cli:build": "next-term build",
"cli:dev": "next-term dev"
}
}
###2. Create command files in your src/app/ directory
Commands are defined by creating command.ts or command.tsx files, using Next.js-style file routing:
Default command (src/app/command.ts):
export default function handler() {
console.log("hello");
}
Subcommand with React/Ink UI (src/app/clock/command.tsx):
import React from 'react';
import { render, Text } from 'ink';
export default async function handler() {
const Clock = () => {
return <Text color="blue">The time is {new Date().toISOString()}</Text>;
};
render(<Clock />);
}
###3. Build and run
# Build your CLI
npx next-term build
# Or run in watch mode during development
npx next-term dev
This generates a distributable CLI in public/cli/ that users can install via:
curl https://your-domain.com/cli/install | sh
##Routing Summary
| File Path | CLI Command |
|---|---|
src/app/command.ts | my-cli (default) |
src/app/clock/command.tsx | my-cli clock |
src/app/users/[id]/command.ts | my-cli users <id> |
The file structure mirrors Next.js routing, but for CLI commands instead of web pages!
END OF POST