Как настроить Cursor AI для написания кода на Flutter
FlutterPulseЭта статья переведена специально для канала FlutterPulse. В этом канале вы найдёте много интересных вещей, связанных с Flutter. Не забывайте подписываться! 🚀
Вы можете писать лучший код, используя правила Cursor. Эта статья научит вас, как их структурировать и сделает вас в 10 раз продуктивнее
Vibe coding, также известный как vibecoding, — это подход к программированию, который использует Искусственный Интеллект (AI) для упрощения разработки программного обеспечения. Термин был придуман Андреем Карпати в феврале 2025 года. Эта инновационная практика позволяет программистам выражать свои потребности в кодировании простым языком, который затем система AI преобразует в рабочий код. Используя большие языковые модели, настроенные для задач кодирования, vibe coding позволяет даже новичкам создавать и отлаживать программное обеспечение без необходимости в обширных знаниях программирования.
Процесс делает акцент на передаче "настроения" намерений программиста
Короче говоря.
Вместо того чтобы иметь копилот.
Вы — копилот.
Vibe coding с Cursor AI?
Если вы не знаете, что такое Cursor.
Это потому, что вы давно не открывали X, Reddit или любой технологический сайт.
Cursor — это редактор кода на основе VSCode. "За всего 4 месяца AI-помощник для кодирования Cursor привлек еще $100M при оценке в $2,6B, возглавляемой Thrive, говорят источники"
Как и Lovable и некоторые другие стартапы в этой области. Их число пользователей растет с каждым днем.
Что делает его уникальным?
Cursor использует LLMs на максимум. И помогает вам в этом. Когда VSCode редактирует один файл и тратит на это 1 час. Cursor может создавать несколько файлов, редактировать их и делать это намного быстрее. У него также есть множество инструментов, чтобы сделать LLM более релевантными и перестать генерировать вам бесполезный код.
Как настроить Cursor AI для написания лучшего Flutter-кода
Всё дело в контексте
LLM не являются творческими. Они используют то, чему вы их учите. Вот почему нетехнические люди создают не поддерживаемый код с помощью AI. Они не знают, как разговаривать с машиной.
Чтобы создать отличное программное обеспечение с этими редакторами, вам нужно говорить на языке программирования и давать правильные инструкции.
Вы — копилот. Вы — творческая личность. Если вы скажете повернуть направо, машина повернет направо, даже если там стена
Cursor Rules to rules them all
Cursor включил потрясающую идею. Внутри папки .rules вы можете написать все правила, которые сможете предоставить агенту.
Эти правила написаны с использованием markdown
Но это еще не всё.
- Ссылаться на файл напрямую в правилах, используя (@file)
- Давать описание для правила
- Шаблон для файлов, на которые это правило может применяться
Создание наших правил
Теперь это то, что я лично нашел продуктивным. Я нашел некоторые подсказки, практики у других и создал свои собственные
Рабочий процесс и описание проекта
Первое правило, с которого стоит начать, — это описание вашего проекта. Но также объяснение, как вы хотите, чтобы работал ИИ.
Пример:
Please think out loud and provide - Обзор выполненной работы - Обоснование решений - чек-лист следующих шагов
Таким образом ИИ также будет объяснять и предоставлять обзор того, что он делает. Я также люблю просить его не говорить слишком много. Просто предоставлять код и давать обзор только если я попрошу об этом.
Правила Flutter
Вот где начинается самое интересное. Этот файл изменит все.
Каждый раз, когда мы хотим создать новый модуль, виджеты… мы будем предоставлять этот список правил нашему агенту. Теперь в зависимости от того, как вы работаете и какие пакеты используете, вам нужно будет создать это.
Я обнаружил, что мне нужно предоставить эти разделы для правил Flutter
Общие рекомендации по Dart
Пример:
- Избегайте использования типа any - Создавайте необходимые типы - Не оставляйте пустые строки внутри функции - Один экспорт на файл - Предпочитайте супер-конструктор ...
Номенклатура
Это то, как называть классы Dart, методы…
- Используйте PascalCase для классов. - Используйте camelCase для переменных, функций и методов. - Используйте underscores_case для имен файлов и директорий. - Избегайте магических чисел и определяйте константы. - Начинайте каждую функцию с глагола. ...
Импорты
- всегда используйте импорт пакетов даже для файлов нашего проекта Пример: import 'package:apparence_kit/core/data/entities/upload_result.dart'; - Соблюдайте правило always_use_package_imports - Наш пакет называется apparence_kit - НЕ используйте относительные импорты для файлов в lib/
Без этого агент будет создавать относительные импорты. Но команда Dart и Flutter рекомендует использовать импорт пакетов.
Правило архитектуры
Теперь внутри правил Flutter вы должны предоставить четкие правила о том, как архитектурировать ваше приложение. То есть вы должны дать
- Определение и небольшой пример файлов каждого слоя
Мне также нравится предоставлять небольшой пример того, как создать новый модуль. Но помните, что нужно стараться сделать это как можно проще. ИИ должен получать данные, но также не может обрабатывать слишком много данных одновременно. ИИ не человек, но его поведение близко к человеческому. Нам нужно найти правильный баланс между предоставлением достаточного количества данных и не перегружать его.
Правило модульного тестирования
Просто потому, что мы используем ИИ, не означает, что нам не нужно писать тесты.
Теперь писать тесты даже быстрее, чем раньше. Но как и во всем остальном, вам нужно объяснить ИИ четкую стратегию того, что и как тестировать.
Например, в ApparenceKit мы делали упор на Fake вместо Mocks. Вам нужно объяснить вашему агенту, как работать с API, так как модульные тесты не имеют доступа к сети.
Если вам интересно, как писать лучшие тесты с Flutter с использованием фейков, вы можете прочитать эту статью.
Добавление документации с веб-страницы
Вы можете добавить документацию с веб-страницы в ваш контекст
- Нажмите cmd + p
- введите "> add new doc"
- Затем введите ссылку на веб-страницу для добавления
Теперь вы сможете ссылаться на это, используя
Блокноты
Вы будете создавать много небольших запросов для вызова каждого правила, когда они вам понадобятся
Например, когда я хочу создать новый модуль, я использую это
Using our context @context.mdc ApparenceKit guidelines @flutter.mdc and @supabase_api.mdc create a new module that
Поскольку я не хочу писать это все время, я поместил это в блокнот.
Теперь мне нужно просто написать
@newModule [описание и спецификации модуля]
Как стать в 10 раз продуктивнее с Cursor
Как я говорил ранее
Всё дело в предоставлении AI контекста и знаний.
AI — это просто пилот, который следует вашим правилам. Агенты плохо пишут хороший код. Если не научить его, как это делать.
Именно здесь стоит рассмотреть использование стартового набора.
- он предоставляет четкую архитектуру
- готовые модули и страницы, чтобы у AI были примеры для использования
- предварительно настроенные проекты (AI не может настроить файлы Xcode)
AI Agent убивают no-code. С правильным стартовым набором и правилами Cursor вы будете в 10 раз продуктивнее любого no-code конструктора. Но это будет в другой статье.
Вы также можете посмотреть наше видео о том, как настроить Cursor AI для написания Flutter-кода
💡 Наш шаблон Flutter предоставляет полный список правил, которые работают с предоставленной архитектурой. Всё дано агенту, чтобы вы могли быть продуктивными сразу.