uniappx-project-creator

Creates new uni-app-x projects with Vue 3 + TypeScript + Vite via CLI or HBuilderX, including tsconfig.json setup, manifest.json and pages.json configuration, and Composition API project templates. Use when the user wants to scaffold a new uni-app-x project, initialize TypeScript project files, or set up the uni-app-x development environment.

261 stars

Best use case

uniappx-project-creator is best used when you need a repeatable AI agent workflow instead of a one-off prompt. It is especially useful for teams working in multi. Creates new uni-app-x projects with Vue 3 + TypeScript + Vite via CLI or HBuilderX, including tsconfig.json setup, manifest.json and pages.json configuration, and Composition API project templates. Use when the user wants to scaffold a new uni-app-x project, initialize TypeScript project files, or set up the uni-app-x development environment.

Creates new uni-app-x projects with Vue 3 + TypeScript + Vite via CLI or HBuilderX, including tsconfig.json setup, manifest.json and pages.json configuration, and Composition API project templates. Use when the user wants to scaffold a new uni-app-x project, initialize TypeScript project files, or set up the uni-app-x development environment.

Users should expect a more consistent workflow output, faster repeated execution, and less time spent rewriting prompts from scratch.

Practical example

Example input

Use the "uniappx-project-creator" skill to help with this workflow task. Context: Creates new uni-app-x projects with Vue 3 + TypeScript + Vite via CLI or HBuilderX, including tsconfig.json setup, manifest.json and pages.json configuration, and Composition API project templates. Use when the user wants to scaffold a new uni-app-x project, initialize TypeScript project files, or set up the uni-app-x development environment.

Example output

A structured workflow result with clearer steps, more consistent formatting, and an output that is easier to reuse in the next run.

When to use this skill

  • Use this skill when you want a reusable workflow rather than writing the same prompt again and again.

When not to use this skill

  • Do not use this when you only need a one-off answer and do not need a reusable workflow.
  • Do not use it if you cannot install or maintain the related files, repository context, or supporting tools.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/uniappx-project-creator/SKILL.md --create-dirs "https://raw.githubusercontent.com/partme-ai/full-stack-skills/main/skills/uniapp-skills/uniappx-project-creator/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/uniappx-project-creator/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How uniappx-project-creator Compares

Feature / Agentuniappx-project-creatorStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Creates new uni-app-x projects with Vue 3 + TypeScript + Vite via CLI or HBuilderX, including tsconfig.json setup, manifest.json and pages.json configuration, and Composition API project templates. Use when the user wants to scaffold a new uni-app-x project, initialize TypeScript project files, or set up the uni-app-x development environment.

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

## When to use this skill

Use this skill whenever the user wants to:
- Create a new uni-app-x project from scratch
- Initialize uni-app-x project structure with TypeScript and Vue 3
- Set up development environment for uni-app-x
- Generate project templates with TypeScript configuration
- Configure manifest.json and pages.json for uni-app-x
- Create uni-app-x pages and components with TypeScript
- Set up uni-app-x project with HBuilderX or CLI

## How to use this skill

To create a uni-app-x project with a single command or via HBuilderX:

1. **Identify the project type** from the user's request:
   - Standard uni-app-x project → Use TypeScript + Vue 3 template
   - HBuilderX project → Use HBuilderX creation method
   - CLI project → Use official CLI commands

2. **Load the appropriate example file** from the `examples/guide/` directory:
   - `examples/guide/installation.md` - Installation and environment setup
   - `examples/guide/quick-start.md` - Quick start guide
   - `examples/guide/project-types.md` - Different project types and templates

3. **Load the appropriate template file** from the `templates/` directory:
   - `templates/project-templates.md` - Project structure templates
   - `templates/cli-commands.md` - CLI command templates

4. **Follow the specific instructions** in those files for project creation, structure, and configuration

5. **Generate the project structure** with proper TypeScript and Vue 3 configurations

**Important Notes**:
- This skill focuses on uni-app-x CLI quickstart and HBuilderX creation flows
- Use one command creation when the user wants "一句话创建"
- uni-app-x requires Vue 3 + TypeScript + Vite

## Examples and Templates

### Examples

Located in `examples/guide/`:

- **installation.md** - Installation guide for uni-app-x development environment
- **quick-start.md** - Quick start guide for creating first uni-app-x project
- **project-types.md** - Different project types and configurations

### Templates

Located in `templates/`:

- **project-templates.md** - Complete project structure templates with TypeScript
- **cli-commands.md** - CLI command templates for project creation

## API Reference

This skill focuses on project creation and initialization. For component and API references, see `uniappx-project-guide`.

## Best Practices

1. **Use TypeScript**: uni-app-x requires TypeScript, ensure proper type definitions
2. **Vue 3 Composition API**: Use Composition API with `<script setup>` syntax
3. **Configure properly**: Set up manifest.json, pages.json, and tsconfig.json correctly
4. **Organize structure**: Follow standard uni-app-x directory structure
5. **Version control**: Initialize git repository after project creation

## Resources

- **Official Documentation**: https://uniapp.dcloud.net.cn/quickstart-cli.html
- **uni-app-x Documentation**: https://doc.dcloud.net.cn/uni-app-x/
- **HBuilderX**: https://www.dcloud.io/hbuilderx.html
- **TypeScript**: https://www.typescriptlang.org/
- **Vue 3**: https://cn.vuejs.org/

## Keywords

uniappx, uni-app-x, project creator, TypeScript, Vue 3, project initialization, HBuilderX, manifest.json, pages.json, uni-app-x setup, uni-app-x template, 创建项目, 项目初始化, 快速开始

Related Skills

vscode-project-init

261
from partme-ai/full-stack-skills

Scaffold a new VS Code extension project using TypeScript via Yeoman generator (yo code), creating src/extension.ts entry point and package.json manifest. Use when the user wants to start a new VS Code extension project from scratch.

skill-sop-creator

261
from partme-ai/full-stack-skills

Creates Standard Operating Procedures (SOPs) by combining atomic Agent Skills into multi-step composite workflows with decision logic and human-in-the-loop checkpoints. Supports searching available skills, drafting SOP structures, and validating dependencies. Use when the user wants to design automated business workflows, chain multiple skills into a repeatable process, or create composite skill orchestrations.

skill-creator

261
from partme-ai/full-stack-skills

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that extends Claude's capabilities with specialized knowledge, workflows, or tool integrations.

uniappx-uview-pro

261
from partme-ai/full-stack-skills

Integrates uView Pro component library into UniAppX (uni-app-x) projects with TypeScript and Composition API, including easycom configuration, pages.json and manifest.json setup, and platform-specific handling. Use when the user needs to add uView Pro components to a UniAppX project, configure TypeScript .uts integration, or handle cross-platform styling.

uniappx-project

261
from partme-ai/full-stack-skills

Provides per-component and per-API examples with platform compatibility details for uni-app-x (Vue 3 + TypeScript + Vite). Use when the user needs official uni-app-x built-in components, API references with examples, cross-platform compatibility checks, or conditional compilation guidance for uni-app-x projects.

uniapp-project

261
from partme-ai/full-stack-skills

Provides per-component and per-API examples with cross-platform compatibility details for uni-app, covering built-in components, uni-ui components, and APIs (network, storage, device, UI, navigation, media). Use when the user needs official uni-app components or APIs, wants per-component examples with doc links, or needs platform compatibility checks.

uniapp-project-creator

261
from partme-ai/full-stack-skills

Creates new uni-app projects via the official CLI or HBuilderX with Vue 2/Vue 3 template selection, manifest.json and pages.json configuration, and directory structure setup. Use when the user wants to scaffold a new uni-app project, initialize project files with a single command, or set up the development environment.

tauri-app-creator

261
from partme-ai/full-stack-skills

Create new Tauri v2 projects using create-tauri-app with frontend template selection and minimal boot verification. Use when bootstrapping a new Tauri app, choosing between npm/pnpm/bun/cargo installation methods, or verifying first-run dev mode.

stitch-skill-creator

261
from partme-ai/full-stack-skills

Factory skill for creating new Stitch Scenario Skills with the Design First, Execute Last SOP. Use when you need to add a new domain (e.g. Music Apps, Social Networks, Login Pages) to the Stitch ecosystem. Generates SKILL.md templates, directory structure, and examples via automated script or manual workflow.

stitch-mcp-list-projects

261
from partme-ai/full-stack-skills

List all Stitch projects accessible to the user, returning project names, titles, update times, and thumbnails. Use when the user wants to resume work on an existing Stitch project, browse available projects, or obtain a projectId for screen generation. Supports owned and shared project filters.

stitch-mcp-get-project

261
from partme-ai/full-stack-skills

Retrieve detailed metadata of a specific Stitch project including design theme, fonts, device type, and screen instances. Use when you need project context before generating new screens or to verify project existence. Requires the project resource name in projects/{id} format.

stitch-mcp-create-project

261
from partme-ai/full-stack-skills

Create a new Stitch project container via MCP create_project. Use when starting a new design task, app idea, or fresh workspace in Stitch. Extracts a meaningful title from the user request, returns both the full resource name (projects/{id}) and numeric projectId needed for subsequent screen generation.