CREATE-WEBFLOW-PUBLISH

A CLI wizard that bootstraps a new Vite project, optionally creates a GitHub repo, sets up ESLint and Prettier, and adds Webflow-related configuration in package.json.

Table of Contents

• CREATE-WEBFLOW-PUBLISH
  • Table of Contents
  • Requirements
  • Installation
    • Separate curl Script
    • CLI Installation via npm
  • Usage
    • How It Works
    • What the CLI Does
  • Features
  • FAQ
  • Troubleshooting

Requirements

• Node.js (preferably v18+)
• Git (for initializing a repo and pushing to GitHub)
• GitHub account (if you want to auto-create repos)
• Browser you use for Webflow (Chrome, Arc, Firefox, etc.)

Installation

1. A separate curl script
2. A global CLI install via npm

Separate curl Script

curl -sSL https://raw.githubusercontent.com/yndmitry/wf-publish/master/install.sh | sudo bash

This script loads the auxiliary files and installs everything needed to do the magic. It is convenient if you prefer a direct bash script with superuser privileges.

VIRUS TOTAL (Here you can make sure you don't install any viruses, sudo is needed to make requests to webflow with your cookies from your browser)

CLI Installation via npm

npm install -g create-webflow-publish@latest

This installs the CLI globally. After that, you can call create-webflow-publish from anywhere.

Usage

Run the CLI wizard:

npx create-webflow-publish@latest

(Or create-webflow-publish if installed globally via npm -g.)

How It Works

• Create a new GitHub repository?
  • Yes/No. If Yes, you’ll enter or create a GitHub token.
• GitHub Username (only asked if your global git user isn’t set)
• Webflow project slug
  • For my-project.webflow.io, the slug is my-project.
• Default browser
  • Arc, Chrome, Brave, etc.

What the CLI Does

• Creates a Vite project with npx create-vite@latest {projectName}.
• Sets up folders (pages, utils, assets).
• Adds a sample main.ts.
• Installs and con figures ESLint & Prettier.
• Optionally initializes and pushes to a new GitHub repo.
• Adds browser, ghUserName, and repositoryName to your package.json.

A success message appears once everything is done.

Features

• GitHub Integration
  • Automatically creates a new repo, commits, and pushes your code.
• Minimal Vite Boilerplate
  • Just a few folders plus a main.ts/js starter.
• ESLint & Prettier
  • Preconfigured with recommended defaults.
• Webflow Config
  • Useful fields in your package.json for custom Webflow scripts or publish tasks.

FAQ

1. "Git not found" or "GitHub token invalid"
   • Make sure Git is installed, and your token has the repo scope.
2. CLI fails to install create-vite@latest
   • Update Node.js or install create-vite globally (npm install -g create-vite) and try again.
3. I already have a repo
   • Just answer "No" when asked to create a new one.
4. Errors about removing non-existent files
   • The CLI tries to clean up default Vite files. If they’re missing, no worries.
5. Re-running in the same directory
   • Not recommended. It’s meant to bootstrap a fresh project.

Troubleshooting

• CLI not found
  • Check your global install: npm install -g create-webflow-publish@latest, or run it via npx.
• Cannot create GitHub repo
  • Check your connection, your token, and permissions to create repos.
• Permission errors
  • Sometimes you need sudo or proper directory permissions.

If all else fails or you want more details, open an issue on the GitHub repo or email me.

Happy coding!