Flutter Web: белый экран (ошибка PersistedOffset) - PullRequest
2 голосов
/ 25 марта 2020

В настоящее время я пытаюсь добавить поддержку веб-приложения в существующий проект Flutter (который использует Firebase). Я следовал инструкциям, чтобы настроить все как с Firebase для Web, так и с Flutter. Но когда я пытаюсь запустить проект в Chrome, я получаю пустой экран, и эта ошибка регистрируется: enter image description here enter image description here enter image description here

Я протестировал запуск "Flutter Demo" на Chrome, который работает. Кроме того, у меня есть только "Flutter Demo" для запуска на последнем канале разработчика, поэтому я сейчас и использую это. Бета-канал не работал.

Вот мой паб c .yaml:

enter image description here

А вот мой индекс. html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta content="IE=Edge" http-equiv="X-UA-Compatible">
  <meta name="description" content="A new Flutter project.">

  <!-- iOS meta tags & icons -->
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="astoria">
  <link rel="apple-touch-icon" href="icons/Icon-192.png">

  <!-- Favicon -->
  <link rel="shortcut icon" type="image/png" href="favicon.png"/>

  <title>astoria</title>
  <link rel="manifest" href="manifest.json">
</head>
<body>
  <!-- This script installs service_worker.js to provide PWA functionality to
       application. For more information, see:
       https://developers.google.com/web/fundamentals/primers/service-workers -->
  <script>
    if ('serviceWorker' in navigator) {
      window.addEventListener('load', function () {
        navigator.serviceWorker.register('flutter_service_worker.js');
      });
    }
  </script>

  <!-- The core Firebase JS SDK is always required and must be listed first -->
  <script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-app.js"></script>

  <!-- TODO: Add SDKs for Firebase products that you want to use
      https://firebase.google.com/docs/web/setup#available-libraries -->
  <script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-analytics.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-firestore.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-functions.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.12.0/firebase-storage.js"></script>

  <script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
      apiKey: "...",
      authDomain: "...",
      databaseURL: "...",
      projectId: "...",
      storageBucket: "...",
      messagingSenderId: "...",
      appId: "...",
      measurementId: "..."
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
    firebase.analytics();
  </script>

  <script src="main.dart.js" type="application/javascript"></script>
</body>
</html>

Пожалуйста, дайте мне знать, если любая другая информация может быть полезна. Большое спасибо заранее! :)

Ответы [ 2 ]

2 голосов
/ 12 апреля 2020

Ссылка на эту ссылку GitHub-thread-for-whiteScreenIssue-in-Flutter

Я столкнулся с этой проблемой, также я просто выполнил действия, описанные в теме

flutter channel dev
flutter upgrade
flutter run -d chrome
0 голосов
/ 17 апреля 2020

У меня такое чувство, что вы используете устаревший проект flutter_web . Ошибки, которые вы видите, являются частью этого репо .

Так что я бы сказал, как предлагается в репозитории github, используйте стандартный флаттер с инструкциями из этой страницы, Как указано в другом ответе, вы можете находиться в канале dev, также в соответствии с do c рекомендуется оставаться в канале beta для обычной разработки, а если вам нужна более поздняя версия, напрямую используйте канал master.

Поскольку в вашем pubspec.yaml используется так много пакетов, вам необходимо убедиться, что каждый из них поддерживается во флаттере. Например, не все пакеты Firebase поддерживаются в сети. Для проверки потребуется время, но это необходимый шаг для продвижения вперед.

...