CLI tool for setting up, building and packaging io.Connect Desktop platforms
npm install @interopio/iocd-cli> A seed project for developing and building io.Connect Desktop based products
- io.Connect Desktop Seed Project
- Overview
- Quick Start
- Prerequisites
- Creating Your Project
- Installation
- Running in Development Mode
- Building for Production
- Project Structure
- Configuration
- Basic Settings
- License Key
- Customization
- Applying Modifications
- Changing io.CD System Config
- Changing the Logo
- Custom Applications
- Using Template Applications
- Creating Custom Applications
- Managing Applications
- Development
- Installing or Updating components during development
- Testing
- Running Tests
- Writing Tests
- Building for Production
- Build Commands
- Build Output
- Windows OS:
- macOS:
- Linux:
- Code Signing
- Windows Code Signing
- Option 1: PFX Certificate File
- Option 2: Certificate Store (e.g., DigiCert KeyLocker)
- Option 3: Custom Script
- macOS Code Signing
- Code Signing Configuration
- Notarization Configuration
- CI/CD Integration
- Auto-Updates
- Troubleshooting
- Common Issues
- Getting Help
---
This seed project provides everything needed to build, test, and deploy your branded version of io.Connect Desktop distribution. It includes pre-configured components, build scripts, and CI/CD integration examples.
What's Included:
- ✅ Licensed io.Connect Desktop components
- ✅ Build and packaging scripts
- ✅ Configuration templates
- ✅ Automated testing framework
- ✅ CI/CD pipeline examples
- ✅ Code signing setup guides
---
- Node.js: v22 or higher
- npm: v9 or higher
- Operating System: Windows 10+ or macOS 11+
- License: This seed project requires a valid io.Connect Desktop license to use the included components. For licensing questions, contact sales@interop.io
``bash`
npx @interopio/iocd-cli@latest create # Follow prompts to set up your project
`bash
cd your-project-name
$3
`bash
Start io.Connect Desktop in dev mode
npm run dev
`$3
`bash
Build production installer
npm run build
`---
Project Structure
`
.
├── apps/ # Custom applications (add your own)
├── components/ # Downloaded io.Connect Desktop components
│ ├── iocd/ # Main io.Connect Desktop component (required)
│ └── [other-components]/ # Additional licensed components (devTools, demos, etc.)
├── config/ # Configuration files
│ ├── forge.config.js # Electron Forge configuration
│ ├── iocd.cli.config.json # CLI configuration
│ └── iocd.license.key # License key file (optional)
├── modifications/ # Customizations and overrides
│ ├── base/ # Applied in all modes (dev/build)
│ ├── dev/ # Applied only in development mode
│ └── build/ # Applied only during production builds
├── tests/ # Automated tests
│ └── basic.test.js # Example Playwright test suite
├── .github/workflows/ # CI/CD pipeline examples
├── package.json
└── README.md
`---
Configuration
$3
Product metadata is configured in your
package.json file:`json
{
"name": "your-product-slug",
"version": "1.0.0",
"description": "Your product description",
"productName": "Your Product Name",
"author": "Your Company"
}
`These values are automatically populated by the create script and are used for:
- name → Project identifier (folder name, exe name, package name, etc.)
- productName → Display name shown to users
- description → Product description in installers and metadata
- author → Company name (also used to auto-generate copyright)
- version → Application version
CLI-specific settings go in
config/iocd.cli.config.json:`json
{
"components": {
"store": {
"github": {
"repo": "interopio/iocd-components/releases"
}
},
"list": {
"iocd": "latest"
}
}
}
`> Tip: You can view the full JSON schema for
iocd.cli.config.json in node_modules/@interopio/iocd-cli/dist/schemas/iocd.cli.config.schema.json. Add a $schema property to your config file for IDE autocompletion and validation.$3
Set your license key using:
- Environment variable:
IOCD_LICENSE_KEY
- Config file: config/iocd.license.key---
Customization
$3
Modifications are the recommended way to customize io.Connect Desktop components without directly editing component files. They allow you to change configurations, add applications, modify assets, and override default behavior while preserving your changes across component updates.
Key Concepts:
- Modifications are stored separately from components in the
modifications/ folder
- Changes persist when components are updated or reinstalled
- Mode-specific modifications allow different behavior in dev vs. build mode
- Files are copied or merged into components when running iocd dev or iocd buildDirectory Structure:
`
modifications/
├── base/ # Applied in all modes
│ └── iocd/
│ ├── config/
│ ├── assets/
│ └── apps/
├── dev/ # Applied only in dev mode
│ └── iocd/
│ └── config/
└── build/ # Applied only in build mode
└── iocd/
└── config/
`Processing Order:
1. Base modifications (
modifications/base/) are applied first
2. Mode-specific modifications (modifications/dev/ or modifications/build/) are applied second, overriding base when neededCommon Use Cases:
- Replace logos and icons in
modifications/base/iocd/assets/
- Configure system settings in modifications/base/iocd/config/
- Add application definitions in modifications/base/iocd/apps/
- Use different URLs for dev (localhost) vs. build (file://) in mode-specific foldersSpecial File Types:
-
.json.merge - Deep merges with existing JSON instead of replacing
- .delete - Removes the corresponding file
- .replace marker - Replaces entire directory (place in directory to replace)$3
The io.Connect Desktop system configuration (
system.json) controls platform-wide settings like auto-updates, logging, and feature flags. To customize these settings, create modification files that merge with the default configuration.Location:
`
modifications/base/iocd/config/system.json.merge
`Example - Enable Auto-Updates:
`json
{
"autoUpdater": {
"enabled": true,
"updateSource": {
"type": "Service",
"baseUrl": "https://updates.yourcompany.com"
},
"interval": 60
}
}
`Example - Configure Logging:
`json
{
"logging": {
"level": "info",
"appender": "default"
}
}
`Mode-Specific Configuration:
Use different settings for dev vs. build mode:
Dev mode (
modifications/dev/iocd/config/system.json.merge):
`json
{
"logging": {
"level": "debug"
},
"features": {
"devTools": true
}
}
`Build mode (
modifications/build/iocd/config/system.json.merge):
`json
{
"logging": {
"level": "error"
},
"features": {
"telemetry": true
}
}
`Important Notes:
- Use
.merge extension to deep merge with existing configuration
- Without .merge, the file completely replaces the original
- Changes are applied when running iocd dev or iocd build
- Environment variables like ${PRODUCT_VERSION} are automatically expanded$3
Replace the default logo files in
modifications/base/iocd/assets/images/:`bash
modifications/base/iocd/assets/
└── images/
├── logo.ico # Windows executable icon (multiple resolutions)
├── logo.icns # macOS app bundle icon (multiple resolutions)
└── logo.png # Application icon (used in UI)
`Requirements:
- logo.ico: Windows icon file with multiple sizes (16x16, 32x32, 48x48, 256x256)
- logo.icns: macOS icon file with multiple sizes (use Icon Composer or iconutil)
- logo.png: PNG file, recommended size 512x512
$3
io.Connect Desktop includes several built-in applications that you can replace with your own custom versions:
- Workspaces - Workspace management UI
- Groups - Window grouping UI
- Splash Screen - Application splash screen
- Launchpad - Application launcher
- Notifications - Notification center
Applications in the
apps/ folder allow you to customize these built-in apps or add entirely new functionality. This approach keeps your core platform applications in the same repository, eliminating the need to manage them across multiple repositories and simplifying version control, deployment, and coordination.#### Using Template Applications
Template applications can be selected during project creation or added later:
`bash
Add template application
iocd apps add workspacesList available templates
iocd apps list --available
`Available templates:
-
workspaces - Workspace management
- groups - Window grouping
- splash-screen - Loading screen
- launchpad - Application launcherOnce added, build your implementation on top of the template in the
apps/ folder.#### Creating Custom Applications
For custom applications, create a folder in
apps/ with an iocd.app.json file:`
apps/
└── my-custom-app/
├── iocd.app.json # Defines modifications and build behavior
├── package.json
└── src/
`Example
iocd.app.json:In this example:
- Dev mode (triggered by
iocd dev or npm run dev): Executes a start script (typically starts a dev server with hot-reload) and copies the development app configuration so the app definition points to the dev server
- Build mode (triggered by iocd build or npm run build): Executes a build script (typically builds optimized production assets) and copies the final built assets to the modifications folder
`json
{
"dev": {
"script": "start",
"modifications": [
{
"source": "/config/my-app-dev.json",
"destination": "/modifications/dev/iocd/config/apps/my-app.json"
}
]
},
"build": {
"script": "build",
"modifications": [
{
"source": "/dist/",
"destination": "/modifications/build/iocd/assets/my-app"
}
]
}
}
`The
iocd.app.json file defines:
- base: Array of modifications applied in all modes
- dev: Object with optional script (npm script name) and modifications array
- build: Object with optional script (npm script name) and modifications array#### Managing Applications
`bash
Install application dependencies
iocd apps installStart applications in dev mode
iocd apps devBuild applications for production
iocd apps build
`---
Development
Development mode allows you to quickly start io.Connect Desktop with all your configured changes and applications, enabling rapid iteration and testing during development.
When you run dev mode, the CLI will:
1. Apply all relevant modifications - Base modifications and dev-specific modifications are copied to components
2. Start all applications - Runs the dev script for each app (typically starting dev servers with hot-reload)
3. Launch io.Connect Desktop - Starts the platform with all changes applied
`bash
Start io.Connect Desktop in dev mode
iocd devOr using npm script
npm run dev
`$3
To install a component or update existing component while in development mode, use the following command:`bash
Update components
iocd components install Or using npm script (note the -- before the component name)
npm run components-install --
`This command will download and install the latest version of the specified component.
If you want to install a specific version, use:
`bash
iocd components install @Or using npm script (note the -- before the component name)
npm run components-install -- @
`
---Testing
Testing is based on WebdriverIO and depends on the
@interopio/wdio-iocd-service package, which enables starting and controlling io.Connect Desktop from WebDriver. This allows you to create and run comprehensive end-to-end (E2E) tests for your io.Connect Desktop application.$3
Tests are written in the
tests/ folder and can be executed using:`bash
Run all tests
npm testOr using the WebdriverIO CLI directly
npx wdio run ./wdio.config.ts
`$3
Tests are written using WebdriverIO syntax with the io.Connect Desktop service handling application lifecycle. Example test structure:
`javascript
describe('io.Connect Desktop Application', () => {
it('should launch successfully', async () => {
// Your test logic here
// The @interopio/wdio-iocd-service handles starting/stopping io.Connect Desktop
});
});
`Add your test files to the
tests/ directory. They'll run automatically in CI/CD pipelines.---
Building for Production
The build process creates production-ready installers for distribution. It orchestrates multiple steps to produce signed, optimized packages ready for deployment.
What happens during build:
1. Build all applications - Executes build scripts for each app in production mode
2. Reinstall components - Downloads and installs fresh component versions
3. Apply all modifications - Copies base and build-specific modifications to components
4. Code sign binaries - Signs executables and libraries (if configured)
5. Create build artifacts - Generates installers (
.exe setup on Windows, .dmg on macOS, .zip archives)
6. Publish to release server - Uploads artifacts for auto-updates (if configured)Build System:
The build process is based on Electron Forge, a complete toolchain for building and packaging Electron applications. The main configuration is located in
config/forge.config.js, where you can customize makers, publishers, and build behavior.$3
`bash
Build installer
iocd buildOr using npm script
npm run buildBuild options
iocd build --output custom/path # Custom output directory
iocd build --publish-only # Skip build, only publish
iocd build --skip-install # Skip component installation
`$3
Depending on OS you can configure Electron Forge makers to produce different types of artifacts. We have tested the following configurations:
#### Windows OS:
1. Squirrel.Windows installer (
.exe setup)
* You can change the install GIF by replacing the install.gif in assets folder.
* The app will be installed into %LocalAppData%\YourAppName. Squirrel is opinionated and does not allow changing this path.
* By default the UserData folder generated by the platform will stay in %LocalAppData%\interop.io\io.Connect Desktop folder. You can change this by add the following system.json.merge-win32 file in modifications/base/iocd/config/system.json.merge-win32 (the merge file has win32 suffix which indicates it is only applied on Windows OS):`json
{
"paths": {
"userData": "%LocalAppData%/${PRODUCT_SLUG}/UserData/%IO_CD_ENV%-%IO_CD_REGION%",
"cache": {
"location": "%LocalAppData%/${PRODUCT_SLUG}/Cache/%IO_CD_ENV%-%IO_CD_REGION%",
"copy": true
}
}
}
`
1. Portable ZIP archive#### macOS:
1. DMG disk image
2. ZIP archive
#### Linux
You can build Windows OS installers on Linux, but Wine and Mono must be installed on the runner.
NOTE: It may also be necessary to install the
zip command, because it is used to create ZIP archives, and you may also have to alias wine64 as wine. Linux does not support code signing for Windows OS.The full list of makers is available in the Electron Forge documentation.
$3
Code signing ensures that your application is trusted by operating systems and users can verify it hasn't been tampered with. Both Windows and macOS require code signing for distribution.
#### Windows Code Signing
##### Option 1: PFX Certificate File
`json
{
"win": {
"codeSign": {
"type": "signtool",
"pfxPath": "path/to/certificate.pfx",
"pfxPassword": "${WIN_PFX_PASS}"
}
}
}
`##### Option 2: Certificate Store (e.g., DigiCert KeyLocker)
`json
{
"win": {
"codeSign": {
"type": "signtool",
"certificateSha1": "${WIN_CERT_SHA1}"
}
}
}
`Important:
- If using DigiCert KeyLocker, run
smctl windows certsync before building to sync certificates to Windows store
- Either pfxPath or certificateSha1 must be provided (not both)
- Set type to "off" to disable code signing##### Option 3: Custom Script
For advanced signing scenarios, you can provide a custom signing script:
`json
{
"win": {
"codeSign": {
"type": "custom",
"customCodeSignScriptPath": "path/to/custom-sign.js"
}
}
}
`Your custom script should export a function that receives the binary path and config:
`javascript
// custom-sign.js
module.exports = async function(binaryPath, config) {
// Your custom signing logic here
console.log(Signing ${binaryPath});
// Use any signing tool or API you need
};
`#### macOS Code Signing
##### Code Signing Configuration
`json
{
"mac": {
"codeSign": {
"type": "keychain",
"identity": "Developer ID Application: Your Company (TEAM_ID)"
}
}
}
`Options:
-
type: "keychain" (use keychain certificate), "certificate" (use .p12 file), "custom" (custom script), or "off" (no signing)
- identity: Developer ID Application identity or SHA-1 hash (optional - auto-selected if not specified)
- keychain: Keychain name or path (optional - uses default keychain if not specified)Custom Script Option:
For advanced signing scenarios, you can provide a custom signing script:
`json
{
"mac": {
"codeSign": {
"type": "custom",
"customCodeSignScriptPath": "path/to/custom-sign.js"
}
}
}
`Your custom script should export a function that receives the app bundle path and config:
`javascript
// custom-sign.js
module.exports = async function(appBundlePath, config) {
// Your custom signing logic here
console.log(Signing ${appBundlePath});
// Use any signing tool or API you need
};
`##### Notarization Configuration
`json
{
"mac": {
"notarization": {
"type": "notarytool",
"appleId": "${MAC_NOTARIZATION_APPLE_ID}",
"appleIdPassword": "${MAC_NOTARIZATION_APPLE_ID_PASSWORD}",
"appleTeamId": "${MAC_NOTARIZATION_APPLE_TEAM_ID}"
}
}
}
`Important:
- Notarization is required for distribution outside Mac App Store
- Use app-specific password (not your regular Apple ID password)
- Generate app-specific password at appleid.apple.com
- Set type to
"off" to skip notarization (for development builds)Custom Script Option:
For advanced notarization scenarios, you can provide a custom notarization script:
`json
{
"mac": {
"notarization": {
"type": "custom",
"customNotarizationScriptPath": "path/to/custom-notarize.js"
}
}
}
`Your custom script should export a function that receives the app bundle path and config:
`javascript
// custom-notarize.js
module.exports = async function(appBundlePath, config) {
// Your custom notarization logic here
console.log(Notarizing ${appBundlePath});
// Use any notarization tool or API you need
};
`$3
Continuous Integration and Continuous Deployment (CI/CD) automates building, testing, and publishing your io.Connect Desktop application. The seed project includes an GitHub Actions workflow located in
.github/workflows/build.yml. It produces signed installers and can publish them to a release server.It is possible to build a Windows installer on Linux. Below is an example Dockerfile that sets up a Linux container to build a Windows installer:
`Docker
FROM node:lts-alpineinstall wine
RUN apk update
RUN apk add --no-cache wine dpkg
RUN dpkg --add-architecture i386
RUN alias wine=win64 # electron-forge uses wine command, so we need an aliasInstall Mono
RUN apk update
RUN apk add mono-devInstall zip command
This is necessary for this Dockerfile, but may not be necessary for a Linux
runner in CI.
RUN apk update
RUN apk add zipGenerate io.Connect Desktop project
RUN npx @interopio/iocd-cli@latest create \
--non-interactive \
--product-name "io.Connect Desktop" \
--folder-name io-connect-desktop \
--license-key Build installer
WORKDIR /io-connect-desktop
RUN npm install
RUN npm run setup
RUN npm run build
`$3
Setting up auto-updates allows your users to automatically receive new versions of your application.
Requirements:
Auto-updates are supported for specific build artifact types:
- Windows: Squirrel.Windows installers (
.exe setup files)
- macOS: ZIP archivesOther build outputs (portable ZIP on Windows, DMG on macOS) do not support automatic updates.
Setup Steps:
1. Set up a release server
You can use existing solutions or build your own:
- Existing services: Nucleus, Hazel, or other update servers (see Electron update services)
- Custom solution: Build your own update server following Squirrel protocols
2. Configure io.Connect Desktop to check the update server
Create or modify
modifications/base/iocd/config/system.json.merge:`json
{
"autoUpdater": {
"enabled": true,
"updateSource": {
"type": "Service",
"baseUrl": "https://updates.yourcompany.com"
},
"interval": 60
}
}
`3. Publish updates
Choose one of the following approaches:
Option A: Automatic publishing during build - Configure publishers in
config/forge.config.js:`javascript
publishers: [
{
name: '@electron-forge/publisher-electron-release-server',
config: {
baseUrl: 'https://updates.yourcompany.com',
username: process.env.RELEASE_SERVER_USERNAME,
password: process.env.RELEASE_SERVER_PASSWORD
}
}
]
`Option B: Manual upload - After building, manually upload the installer artifacts to your release server.
4. Test auto-updates
- Install your application using the signed installer
- Publish a new version to your update server
- Launch the application and verify it detects and installs the update
---
Troubleshooting
$3
Build fails with "License not found"
- Ensure
IOCD_LICENSE_KEY environment variable is set
- Or create config/iocd.license.key file with your license keyCode signing fails on Windows
- Verify certificate is valid and not expired
- Check that
pfxPassword is correct
- For certificate store signing: Ensure smctl windows certsync was run first
- Verify exactly one of pfxPath or certificateSha1 is configured (not both)macOS notarization fails
- Use app-specific password, not regular Apple ID password
- Generate app-specific password at appleid.apple.com
- Verify Apple Developer Program membership is active
- Check that
appleTeamId matches your Developer Team IDApplication won't start in dev mode
- Run
iocd setup to verify component installation
- Check that components/iocd directory exists
- Review logs in system temp directoryComponents not downloading
- Verify network connectivity
- Check component store configuration in
config/iocd.cli.config.json`- 📚 Documentation
- 💬 Community Forum
- 📧 Support Portal
---