init-codeapp

Initialize Code App Project

Initialize a new Power Apps Code App with proper configuration for development and deployment.

What This Skill Does

1. Creates project from official Microsoft template
2. Configures package.json for dual-server development (Vite + pac code run)
3. Sets up vite.config.ts with base: './' (critical for deployment)
4. Installs all dependencies including concurrently
5. Runs pac code init to register with Power Platform
6. Validates entire setup with integrated validation

Usage

/init-codeapp my-app-name

or let Claude invoke automatically:

Initialize a new Code App called todo-app

Workflow

Step 1: Check Prerequisites

Verify required tools are installed:

# Check Node.js
node --version

# Check Power Platform CLI
pac --version

# Check Git
git --version

If any tools are missing, inform the user and provide installation links:

• Node.js: https://nodejs.org/
• Power Platform CLI: https://learn.microsoft.com/power-platform/developer/cli/introduction
• Git: https://git-scm.com/

Step 2: Authentication Check

# Check if user is authenticated
pac auth list

If not authenticated or environment not selected:

pac auth create
pac env select --environment <environmentId>

Step 3: Create Project from Template

# Use official Microsoft template
npx degit github:microsoft/PowerAppsCodeApps/templates/vite $ARGUMENTS[0]
cd $ARGUMENTS[0]

Naming Best Practice: For shared environments, suggest including username:

Suggested name: $ARGUMENTS[0]-{username}
Would you like to use this naming pattern? (Prevents conflicts in shared environments)

Step 4: Install Dependencies

npm install

# Install required dev dependencies
npm install --save-dev concurrently

# Install recommended dependencies
npm install @tanstack/react-query

Step 5: Configure package.json Scripts

Check if scripts need updating:

cat package.json | grep -A 5 '"scripts"'