Requirements - HTFlow Documentation

System Requirements

Ensure your system meets these requirements before installing HTFlow:

Minimum Requirements

VS Code

Version 1.99.0 or higherDownload from code.visualstudio.com

Node.js

Version 16.x or higherRecommended: Node.js 18.x LTSDownload from nodejs.org

npm

Version 8.x or higherIncluded with Node.jsOr use Yarn, pnpm

Storage

Minimum: 500 MB freeRecommended: 2 GB for projects

Recommended Specifications

For optimal performance:

Operating System

Supported:

macOS 10.15 (Catalina) or later
Windows 10/11 (64-bit)
Linux (Ubuntu 20.04+, Debian 10+, Fedora 34+)

HTFlow works on all platforms that support VS Code and Node.js

Hardware

Recommended:

CPU: Quad-core processor or better
RAM: 8 GB minimum, 16 GB recommended
Disk: SSD for better performance
Display: 1920x1080 or higher

Network

Requirements:

Internet connection for installation
Download speed: 5 Mbps or higher
Required for:
- Installing HTFlow CLI
- Updating packages
- Webflow deployment

Software Dependencies

Required

Node.js
npm/Package Manager
VS Code / Cursor

Why needed: HTFlow CLI runs on Node.jsInstallation:

brew install node

Verify installation:

node --version
# Should output: v18.x.x or higher

Why needed: Install and manage HTFlow CLI and dependenciesComes with Node.js, or install alternatives:

Yarn

npm install -g yarn

pnpm

npm install -g pnpm

Verify installation:

npm --version
# Should output: 8.x.x or higher

Why needed: IDE for development and HTFlow extensionOptions:

VS Code: code.visualstudio.com
Cursor: cursor.sh (AI-powered VS Code fork)

Both support HTFlow extensionVerify installation:

code --version
# or
cursor --version

Optional but Recommended

Git

For version controlDownload: git-scm.com

git --version

Modern Browser

For dev server testing

Chrome 90+
Firefox 88+
Safari 14+
Edge 90+

Browser Requirements

For testing and preview:

Development
Webflow Conversion

Any modern browser:

Google Chrome (recommended)
Mozilla Firefox
Safari
Microsoft Edge
Brave

Development server works with all modern browsers

HTFlow Components

Different components available for your workflow:

HTFlow CLI

Core componentCommand-line interface for all HTFlow operations

npm install -g htflow-cli

VS Code Extension

Visual interfaceGUI for HTFlow commands in VS Code/CursorInstall from VS Code Marketplace

Chrome Extension

Conversion toolConvert HTML to Webflow directly in browserInstall from Chrome Web Store

MCP Integration

AI assistant supportEnable AI assistants to work with HTFlow

htflow mcp-install

AI Tools Integration

HTFlow works with popular AI coding tools:

Cursor AI
Claude
GitHub Copilot
Other AI Tools

Built-in AI assistantRequirements:

Cursor IDE
HTFlow extension
MCP integration (optional)

Features:

AI-powered code generation
HTFlow standards compliance
Automatic validation

Webflow Requirements

For deployment to Webflow:

Webflow Account

Required:

Active Webflow account
Site plan (for custom code)

Plan Requirements

For custom code import:

Webflow Site Plan or higher
NOT available on free plan

Custom code features require paid plan

Conversion Tools

Choose one:

HTFlow Webflow App
HTFlow Chrome Extension

Both available after HTFlow CLI installation

Permissions

Required system permissions:

File System

Read/write in workspace
Create/modify project files
Access temp directories

Network

npm registry access
Download packages
Connect to dev server

Process Execution

Run Node.js processes
Execute npm commands
Start development servers

Port Access

Bind to local ports
Default: 3000-3010
Configurable in settings

Firewall Configuration

For development server access:

macOS
Windows
Linux

Allow Node.js

# System will prompt automatically
# Or manually add in System Preferences:
# Security & Privacy → Firewall → Firewall Options
# Allow incoming connections for Node.js

Windows Firewall

# Add firewall rule for Node.js
New-NetFirewallRule -DisplayName "HTFlow Dev Server" `
  -Direction Inbound `
  -Program "C:\Program Files\nodejs\node.exe" `
  -Action Allow

ufw

# Allow Node.js through firewall
sudo ufw allow from 192.168.1.0/24 to any port 3000

# Or allow all local connections
sudo ufw allow in on lo

Verification Checklist

Use this checklist to verify your setup:

Check Node.js

node --version
npm --version

Both commands should return version numbers

Check VS Code

code --version

Should show VS Code version 1.99.0+

Install HTFlow CLI

npm install -g htflow-cli
htflow version

Should display HTFlow version

Install VS Code Extension

Open VS Code Extensions
Search “Htflow Html to Webflow”
Install extension

HTFlow icon should appear in Activity Bar

Test Installation

Open HTFlow panel (Ctrl+Shift+H)
Click “Show Version”

Should display version information

Troubleshooting Setup

Node.js Not Found

Issue: node command not recognizedSolutions:

Reinstall Node.js
Add Node.js to PATH:
- Windows: Edit System Environment Variables
- macOS/Linux: Add to .bashrc or .zshrc
Restart terminal/VS Code

Permission Denied

Issue: Cannot install global packagesSolutions:

macOS/Linux

# Use sudo (not recommended for regular use)
sudo npm install -g htflow-cli

# Or fix npm permissions (recommended)
mkdir ~/.npm-global
npm config set prefix '~/.npm-global'
echo 'export PATH=~/.npm-global/bin:$PATH' >> ~/.bashrc

Windows

# Run as Administrator
# Right-click terminal → Run as Administrator
npm install -g htflow-cli

Extension Not Working

Issue: HTFlow extension doesn’t appear or workSolutions:

Verify VS Code version: code --version
Reload window: Ctrl+Shift+P → “Reload Window”
Check extension is enabled in Extensions panel
Reinstall extension
Check for conflicting extensions

Port Already in Use

Issue: Cannot start dev serverSolutions:

# Find process using port 3000
# macOS/Linux
lsof -i :3000

# Windows
netstat -ano | findstr :3000

# Kill the process or change port in config

Performance Optimization

Tips for optimal HTFlow performance:

Use SSD

Significant improvement in build and dev server performance

Increase RAM

8 GB minimum, 16 GB for large projects

Close Unused Apps

Free up system resources during builds

Update Regularly

Keep Node.js, VS Code, and HTFlow updated

Next Steps

Installation Guide

Install HTFlow extension and CLI

Quick Start

Create your first HTFlow project

Getting Started

​System Requirements

​Minimum Requirements

VS Code

Node.js

npm

Storage

​Recommended Specifications

​Software Dependencies

​Required

​Optional but Recommended

Git

Modern Browser

​Browser Requirements

​HTFlow Components

HTFlow CLI

VS Code Extension

Chrome Extension

MCP Integration

​AI Tools Integration

​Webflow Requirements

​Permissions

File System

Network

Process Execution

Port Access

​Firewall Configuration

​Verification Checklist

​Troubleshooting Setup

​Performance Optimization

Use SSD

Increase RAM

Close Unused Apps

Update Regularly

​Next Steps

Installation Guide

Quick Start

System Requirements

Minimum Requirements

Recommended Specifications

Software Dependencies

Required

Optional but Recommended

Browser Requirements

HTFlow Components

AI Tools Integration

Webflow Requirements

Permissions

Firewall Configuration

Verification Checklist

Troubleshooting Setup

Performance Optimization

Next Steps