Flutter показывает устаревший интерфейс или отсутствуют ресурсы? Исправьте это с помощью однокликовой свежей установки в VS Code

Эта статья переведена специально для канала FlutterPulse. В этом канале вы найдёте много интересных вещей, связанных с Flutter. Не забывайте подписываться! 🚀

Автоматизируйте flutter clean, pub get и удаление приложения, чтобы ваш последний код и активы всегда отображались.

Если вы когда-либо разрабатывали приложение на Flutter, вы знаете эту проблему:
Если вы запускаете свое приложение, вносите изменения, затем останавливаете и перезапускаете — последний запущенный интерфейс все еще отображается вместо вашего нового кода.

Иногда ваши активы вообще не загружаются, и вы получаете ошибки, такие как:

[ERROR:flutter/runtime/dart_vm_initializer.cc(40)] 
Unhandled Exception: Unable to load asset: "assets/search/sort_icon.svg".
E/flutter (29768): The asset does not exist or has empty data.

Даже если файл явно присутствует, Flutter отказывается его загружать.

После некоторых размышлений вы пробуете обычный трюк:

• Запустите flutter clean
• Запустите flutter pub get
• Вручную удалите приложение с вашего устройства

…и волшебным образом все снова работает. Ваш новый интерфейс и активы наконец появляются.

👉 Проблема в том, что делать этот цикл каждый раз медленно и раздражает.

Не было бы лучше, если бы VS Code мог автоматически выполнять это за вас — так чтобы вы могли выбирать между обычным запуском и запуском с чистой установкой без ввода команд или ручного удаления приложений?

Именно это мы настроим в этом руководстве.

🛠 Проблема

• flutter run устанавливает поверх существующего приложения без очистки старых данных.
• Старый кеш, базы данных или активы могут конфликтовать с новыми сборками.
• Ошибки, такие как "Unable to load asset" или неизмененный интерфейс, часто появляются.
• Ручная очистка и удаление занимают дополнительное время.

🛠 Решение — Автоматизация в VS Code

Мы настроим VS Code так, чтобы при нажатии F5 вы могли выбрать между:

1. Обычным запуском (быстрый, для повседневного кодирования).
2. Запуском с чистой установкой (удаление + очистка + pub get + запуск).

Таким образом, вы используете полную очистку только тогда, когда это действительно необходимо.

Шаг 1 — Создание задачи в VS Code

Внутри вашего проекта создайте (или отредактируйте) .vscode/tasks.json:

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Uninstall & Clean",
      "type": "shell",
      "command": "adb uninstall com.example.app || true && flutter clean && flutter pub get",
      "problemMatcher": []
    }
  ]
}

👉 Замените com.example.app на фактическое имя пакета вашего приложения (проверьте в AndroidManifest.xml).

Шаг 2 — Создание конфигураций запуска

Теперь создайте (или отредактируйте) .vscode/launch.json:

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Flutter Debug (Normal Run)",
      "request": "launch",
      "type": "dart",
      "program": "lib/main.dart"
    },
    {
      "name": "Flutter Debug (Fresh Install)",
      "request": "launch",
      "type": "dart",
      "program": "lib/main.dart",
      "preLaunchTask": "Uninstall & Clean"
    }
  ]
}

Это дает вам два варианта в VS Code:

• Обычный запуск → Быстрый запуск с существующей установкой.
• Свежая установка → Удаляет старое приложение, очищает, устанавливает заново, затем запускает.

Шаг 3 — Переключение между запусками

1. Откройте панель Run and Debug в VS Code:

• Сочетание клавиш: Ctrl + Shift + D (Windows/Linux) или Cmd + Shift + D (Mac).

2. В верхнем выпадающем меню вы увидите оба варианта:

• Flutter Debug (Normal Run)
• Flutter Debug (Fresh Install)

3. Выберите тот, который вам нужен.

4. Нажмите F5 для начала.

Теперь вы можете быстро переключаться между обычным сеансом отладки и свежей, чистой установкой.

🎯 Когда использовать каждый вариант?

1. Обычный запуск (по умолчанию)
   . Ежедневная разработка.
   . Быстрая перезагрузка.
   . Используйте, когда вы просто тестируете функции или небольшие изменения в интерфейсе.
2. Свежая установка (Удаление и очистка)
   . Когда появляются ошибки "asset not found".
   . Когда изменения в интерфейсе не отображаются.
   . Когда старая кэш-память, SharedPreferences или записи базы данных вызывают проблемы.
   . Перед окончательным тестированием, чтобы убедиться, что ваше приложение работает правильно на чистом устройстве.

✅ Заключение

С этой настройкой вам больше не нужно:

• Вручную удалять приложение
• Запускать flutter clean
• Запускать flutter pub get

Вместо этого у вас есть два простых варианта внутри VS Code:

• Обычный запуск для скорости.
• Запуск после свежей установки для отладки сложных проблем и тестирования первых установок.

В следующий раз, когда ваш интерфейс не обновится или активы таинственным образом исчезнут, просто переключитесь на Свежая установка — и сэкономьте себе много неудобств. 🚀