К основному содержанию
скилл CX Codex

migrate-app-to-flows — скилл для Claude Code: установка

Скилл автоматизирует перенос веб-приложений с устаревшей платформы Dune на инфраструктуру Flows (appsApi). Он проверяет конфигурации и настраивает сетевые политики.

Установить в Claude Code · Через Skills CLI (Vercel) Все способы и платформы ↓
npx skills add cognitedata/builder-skills --skill migrate-app-to-flows -a claude-code
Открыть на GitHub

Что делает migrate-app-to-flows

Скилл пошагово переводит проект на хостинг Flows. Сначала он запускает аудит файлов app.json, package.json, vite.config.ts и manifest.json. В конфигурации app.json инструмент исправляет формат ключа deployment на массив deployments и выставляет значение "infra": "appsApi".

Для сетевой безопасности агент создаёт корневой файл manifest.json. Он сканирует кодовую базу на вызовы fetch, axios или XMLHttpRequest, чтобы выписать внешние домены в директиву connect-src. При этом системный кластер CDF разрешён по умолчанию и в манифест не добавляется. Скрипты публикации в package.json заменяются на вызов @cognite/cli.

Для авторизации скилл требует запуск вспомогательного навыка setup-flows-auth. Финальным шагом проверяется отсутствие старых зависимостей @cognite/dune и компонентов DuneAuthProvider в коде проекта.

Какие задачи решает

  • перевести проект с Dune на инфраструктуру Flows
  • привести структуру app.json к стандарту appsApi
  • сгенерировать manifest.json с сетевыми правилами CSP
  • обновить скрипты деплоя на @cognite/cli

Примеры запросов агенту

  • Переведи наше старое Dune-приложение на инфраструктуру Flows
  • Мигрируй текущий проект на хостинг Flows и обнови скрипты деплоя
  • Проверь готовность приложения к переносу на appsApi

Как установить migrate-app-to-flows

1Через Skills CLI (Vercel)

npx skills add cognitedata/builder-skills --skill migrate-app-to-flows -a claude-code

2Вручную: положить файлы

~/.claude/skills/migrate-app-to-flows/SKILL.md

Папка скилла целиком; для одного проекта — .claude/skills/migrate-app-to-flows/

По шагам, с командами для каждой платформы: Как установить скилл в Claude Code: пять способов

Вопросы о migrate-app-to-flows

Как установить migrate-app-to-flows в Claude Code?

Выполните команду npx skills add cognitedata/builder-skills --skill migrate-app-to-flows -a claude-code. Файл навыка сохранится по пути ~/.claude/skills/migrate-app-to-flows/SKILL.md.

Что делает скилл migrate-app-to-flows?

Он выполняет аудит конфигурации, переключает инфраструктуру в app.json на appsApi, обновляет команды деплоя на @cognite/cli и генерирует manifest.json с сетевыми разрешениями.

Как в процессе миграции настраивается авторизация?

Скилл делегирует настройку авторизации отдельному навыку setup-flows-auth. Тот устанавливает нужные пакеты, настраивает плагин Vite и подключает метод connectToHostApp.

Исходный текст

SKILL.md · Apache-2.0
---
name: migrate-app-to-flows
description: "MUST be used when migrating a legacy Dune app to the new Flows app hosting infrastructure. Orchestrates the full migration: audits current state, updates app.json to appsApi infra, delegates auth wiring to setup-flows-auth, creates or updates manifest.json network permissions, and updates deploy scripts to @cognite/cli. Use this whenever a user says 'migrate to Flows', 'migrate to new infra', 'move from dune to flows', 'migrate legacy app', or wants to move their existing app to the new Flows app hosting."
allowed-tools: Read, Glob, Grep, Edit, Write, Bash
metadata:
  argument-hint: ""
---

# Migrate App to Flows Infrastructure

Orchestrates the full migration of a legacy Dune app to the new Flows app hosting (`appsApi`). Works through each area in order, skipping any already in the correct state.

## Step 1 — Audit current state

Read `app.json`, `package.json`, `vite.config.ts`, and `manifest.json` (if present).

Report a concise summary before making any changes:

```
Migration audit:
✗ app.json: missing infra field → will add "infra": "appsApi"
✗ Auth: DuneAuthProvider in use → will run setup-flows-auth
✗ manifest.json: missing → will create
✓ Deploy script: already uses @cognite/cli
```

Then proceed through Steps 2–5.

---

## Step 2 — Update `app.json`

If `infra` is already `"appsApi"`, skip this step. Otherwise:

**Fix legacy deployment key format first.** Many POC apps use `"deployment"` (singular, plain object). The CLI requires `"deployments"` (plural, array). If the file has the old format, rename the key and wrap the value in an array before proceeding:

```json
// Before (legacy)
{
  "deployment": { "org": "...", "project": "...", ... }
}

// After (correct)
{
  "deployments": [{ "org": "...", "project": "...", ... }]
}
```

Then add `"infra": "appsApi"`:

```json
{
  "name": "My App",
  "externalId": "my-app",
  "versionTag": "0.0.1",
  "infra": "appsApi",
  "deployments": [...]
}
```

---

## Step 3 — Set up Flows auth

Run the `setup-flows-auth` skill now. It handles everything auth-related: package installation, Vite plugin updates, entry file changes, and wiring up `connectToHostApp`.

---

## Step 4 — Create or update `manifest.json`

The Flows host uses `manifest.json` to enforce a Content Security Policy for the app. It must exist at the repo root.

**Create if missing:**

```json
{
  "manifestVersion": 1,
  "permissions": {
    "network": []
  }
}
```

**Populate network permissions** by scanning for outbound calls to external domains:

```bash
grep -rn "fetch\|axios\|new XMLHttpRequest" src/ --include="*.ts" --include="*.tsx"
```

For each group of external URLs found, add an entry to the `network` array using the `sources`/`directives` shape:

```json
{
  "manifestVersion": 1,
  "permissions": {
    "network": [
      {
        "sources": ["https://api.example.com", "https://maps.googleapis.com"],
        "directives": ["connect-src"]
      }
    ]
  }
}
```

Rules:
- Use full origin (scheme + hostname) in `sources`, not just the hostname.
- `"connect-src"` covers `fetch`/`XMLHttpRequest`. Use `"img-src"` for image URLs, `"font-src"` for fonts.
- The CDF cluster URL is allowed automatically; do not list it.
- If no external calls exist, leave `"network": []`.
- Flag any dynamic URLs the user needs to verify manually.

---

## Step 5 — Update deploy scripts

Replace any `dune deploy` or `npx @cognite/dune` commands in `package.json`:

```json
{
  "scripts": {
    "deploy": "npx @cognite/cli@latest apps deploy --interactive",
    "deploy-preview": "npx @cognite/cli@latest apps deploy --interactive"
  }
}
```

Keep all other scripts (`start`, `build`, `test`, etc.) unchanged.

---

## Step 6 — Final check

```bash
grep -rn "DuneAuthProvider\|useDune\|@cognite/dune" src/ vite.config.ts 2>/dev/null
```

List any remaining hits for the user to resolve. Then report:

```
Migration complete:
✓ app.json: infra set to "appsApi", deployments key is an array
✓ Auth: setup-flows-auth applied
✓ manifest.json: network permissions set
✓ Deploy scripts: updated to @cognite/cli
```

Then tell the user exactly what to do next:

```
Next steps:
1. Run `npm run dev` to start the dev server
2. Open Fusion and verify the app loads and CDF data appears correctly
3. When happy, deploy with: npx @cognite/cli@latest apps deploy --interactive
```

© cognitedata · Apache-2.0 · cognitedata/builder-skills

Похожие скиллы

Все скиллы по теме «DevOps и инфраструктура» →
power-apps-code-app-scaffold официальный github Создаёт каркас Power Apps Code App с React и TypeScript. Подходит для старта проекта с коннектором Power Platform. 8 700установок migrate-oai-app modelcontextprotocol Переводит интерактивные виджеты с OpenAI Apps SDK на MCP Apps SDK. Помогает заменить синхронный вызов window.openai на событийную модель и настроить домены CSP. CX Codex +1 1 100установок tsdown-migrate rolldown Скилл ведёт миграцию TypeScript-библиотеки с tsup на tsdown: таблицы соответствия опций, различия в значениях по умолчанию и замена убранных опций. CX Codex +1 388установок add-app-to-server modelcontextprotocol Скилл добавляет интерактивный HTML-интерфейс к инструментам уже работающего MCP-сервера. Пригодится, когда инструмент возвращает таблицу, график или PDF и текстом это читать неудобно. CX Codex +1 1 200установок nextjs-app-router-fundamentals wsimmonds Скилл ведёт агента по Next.js App Router: перенос с Pages Router, вложенные layout, метаданные, динамические маршруты. Пригодится при переходе на app/. CX Codex +1 2 200установок migrate-ai-sdk-v6-to-v7 vercel Скилл переводит проекты с Vercel AI SDK 6.x на версию 7.0. Помогает обновить зависимости, исправить сломанные типы и заменить устаревшие параметры вызовов. CX Codex +1 5 500установок

Из того же набора24

design Скилл настраивает работу с дизайн-системой Aura в приложениях Flows и Fusion. Помогает выбирать готовые примитивы, расставлять токены вместо сырых значений и собирать интерфейсы. CX Codex +1 1 900установок dependencies-audit Скилл находит уязвимости, устаревшие и заброшенные пакеты, проблемы с лицензиями и чинит их, а не просто составляет отчёт. CX Codex +1 1 900установок test-coverage Скилл находит пробелы в покрытии тестами приложения на Flows и закрывает их: настраивает инструменты, пишет недостающие тесты, правит код ради тестируемости. CX Codex +1 1 900установок integrate-fusion-agent Скилл подключает боковую панель Atlas/EOS в приложение Flows/Fusion через @cognite/app-sdk вместо встроенного чата. CX Codex +1 1 700установок flows-code-review Проводит локальный технический аудит приложений Cognite Flows перед сертификацией. Находит блокирующие замечания и ведёт отчёты по раундам проверки. CX Codex +1 1 600установок flows-external-app-submit Проверяет артефакты сертификации приложений Cognite Flows и запускает отправку через CLI. Нужен на финальном этапе перед передачей приложения на внешнее ревью. CX Codex +1 1 100установок flows-app-brief Скилл проводит разговор о приложении Flows и записывает согласованный App-Brief.md в корень репозитория. CX Codex +1 1 100установок flows-design-review Прогоняет проверки по репозиторию и предлагает черновые оценки 1–5 по десяти вопросам качества дизайна, а вы их подтверждаете или правите. CX Codex +1 1 100установок

Спонсоры проекта

Компании, которые помогают держать аналитику открытой