npm package: @infomaker/create-writer-plugin
Description: CLI tool to create new Naviga Writer plugins with best practices and complete documentation
Author: Naviga Content Lab AB
Latest version: 1.0.8

# @infomaker/create-writer-plugin

CLI tool to create new Naviga Writer plugins with best practices, complete tooling, and comprehensive documentation.

## 🎬 Demo

![Demo](demo.gif)

*To update the demo: install [VHS](https://github.com/charmbracelet/vhs) and run `npm run demo`*

## 🚀 Quick Start

```bash
npx @infomaker/create-writer-plugin
```

That's it! The CLI will guide you through creating your plugin.

## 📋 What You Get

Running `npx @infomaker/create-writer-plugin` creates a complete, production-ready plugin:

```
dw-plugin-your-name/
├── .claude-skill.md              # AI assistant guide (auto-detected by Claude)
├── DEVELOPMENT.md                # Plugin-specific development guide
├── PUBLISHING.md                 # Complete publishing and release guide
├── README.md                     # Plugin documentation
├── manifest.json                 # Plugin metadata
├── package.json                  # Dependencies and scripts
├── src/
│   ├── index.js                  # Entry point with debug logging
│   ├── PluginPackage.ts          # Plugin configuration (JSDoc documented)
│   ├── scss/index.scss           # Styles
│   └── components/
│       └── MainComponent.ts      # Main UI component (inline docs)
├── __tooling__/
│   ├── webpack/                  # Build configurations
│   └── create-local-cert.sh      # SSL certificate script
├── __tests__/                    # Unit tests (optional)
├── .eslintrc.js                  # Linting configuration
├── babel.config.js               # Babel configuration
├── tsconfig.json                 # TypeScript configuration
└── bitbucket-pipelines.yml       # CI/CD pipeline
```

## ✨ Features

### Automatic Name Generation
Enter only the base name (e.g., `naviga-agent`), and all variants are generated automatically:
- **Directory**: `dw-plugin-naviga-agent`
- **Package name**: `dw-plugin-naviga-agent`
- **Manifest name**: `im-naviga-agent`
- **Plugin ID**: `io.infomaker.naviga-agent`

### Complete Tooling
- ✅ Webpack dev server with hot reload
- ✅ TypeScript support
- ✅ Babel transpilation
- ✅ ESLint configuration
- ✅ SSL certificate script
- ✅ Bitbucket Pipelines CI/CD

### Rich Documentation
Every plugin includes:
- **DEVELOPMENT.md** - Plugin-specific quick reference with examples
- **PUBLISHING.md** - Complete guide for releasing and deploying plugins
- **.claude-skill.md** - AI assistant guide (auto-detected by Claude)
- **JSDoc comments** - Throughout generated code
- **Inline examples** - In component templates

### Production-Ready Pattern
Based on working Infomaker plugins:
- Correct naming convention
- Debug logging throughout
- Proper error handling
- Clean code structure

## 📖 Usage

```bash
# Create a new plugin
npx @infomaker/create-writer-plugin

# Follow the prompts:
? Name of plugin: naviga-agent
? Name of organisation: Naviga
? Plugin label: Naviga Agent
? Plugin description: AI-powered content assistance
? Include schema.json? Yes
? Include unit tests? Yes
```

The tool will:
1. ✅ Create project directory
2. ✅ Generate all files
3. ✅ Install dependencies
4. ✅ Show next steps

## 🎯 After Creation

```bash
# Navigate to your plugin
cd dw-plugin-naviga-agent

# Start development
npm start

# Opens at: https://local.plugins.writer.infomaker.io:3000/index.js
```

### Register in Writer

Use these values in Writer plugin configuration:
```
Id:   io.infomaker.naviga-agent
Name: im-naviga-agent
URL:  https://local.plugins.writer.infomaker.io:3000/index.js
```

## 🤖 AI-Friendly

Each plugin includes `.claude-skill.md` which is automatically detected by Claude and other AI assistants. This enables:
- ✅ Context-aware code suggestions
- ✅ Accurate API usage examples
- ✅ Plugin-specific guidance
- ✅ Best practices recommendations

## 📚 Documentation

Created plugins include links to:
- [Plugin Development Guide](https://bitbucket.org/infomaker/writer-plugin-utils/blob/master/PLUGIN_DEVELOPMENT_GUIDE.md)
- [API Reference](https://bitbucket.org/infomaker/writer-plugin-utils/blob/master/API_REFERENCE.md)
- [Troubleshooting](https://bitbucket.org/infomaker/writer-plugin-utils/blob/master/TROUBLESHOOTING.md)
- [Official Writer Documentation](https://docs.navigaglobal.com/writer/developer-guide/index)

## 🛠️ Requirements

- Node.js >= 14.0.0
- npm >= 6.0.0

## 🔗 Related Packages

- [@infomaker/writer-plugin-utils](https://www.npmjs.com/package/@infomaker/writer-plugin-utils) - Build tools and webpack configs used by plugins

## 📄 License

MIT

## 🤝 Contributing

This is an internal Infomaker tool. For issues or suggestions, contact the Writer team.