create-openscript-app

CLI tool to scaffold new OpenScript projects.

Usage

npx create-openscript-app <project-name> [template]

Available Templates

| Template | Description | | ----------- | -------------------------------------------- | | basic | Basic OpenScript project with Vite (default) | | tailwind | Project with TailwindCSS integration | | bootstrap | Project with Bootstrap 5 integration |

Examples

# Create a basic project
npx create-openscript-app my-app

# Create a project with TailwindCSS
npx create-openscript-app my-app tailwind

# Create a project with Bootstrap
npx create-openscript-app my-app bootstrap

What's Included

Each scaffolded project includes:

• 📦 Vite for fast development and building
• 🎯 Pre-configured OpenScript setup with Vite plugin
• 🛣️ Router with example routes
• 🧩 Example components (App, HomePage, AboutUs, Counter)
• 📝 Context management setup
• 📡 Event broker with mediators

⚠️ Important: Vite Plugin Required!

The OpenScript Vite plugin is REQUIRED for your application to work. All templates come pre-configured with the plugin in vite.config.js:

import { defineConfig } from "vite";
import { openScriptComponentPlugin } from "modular-openscriptjs/plugin";

export default defineConfig({
  // ...
  plugins: [
    openScriptComponentPlugin({
      componentsDir: "src/components",
      autoRegister: true,
      generateTypes: true,
    }),
  ],
});

Do NOT remove this plugin - it handles component registration, type generation, and other essential build-time transformations.

Learn More

• OpenScriptJs Documentation
• Vite Documentation

License

MIT