You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Flutter Web提示找不到--web-renderer选项,图片不显示求助

Flutter Web构建问题:回退到支持--web-renderer参数的版本

之前使用flutter build web --web-renderer html命令构建Flutter Web项目时,图片可正常显示,但现在执行该命令时提示“Could not find an option named "--web-renderer"”。尝试flutter build web --release、flutter build web --wasm --release等命令后,图片仍无法显示。确认代码无错误,希望回退到支持该命令的Flutter版本。

以下是项目的index.html代码:

<!DOCTYPE html>
<html>
<head>
  <base href="/">

  <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-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="shandiz">
  <link rel="apple-touch-icon" href="logo_fonttype.png?version=46"> <!-- Versioned -->

  <!-- Favicon -->
  <link rel="icon" type="image/png" href="logo_fonttype.png?version=46"> <!-- Versioned -->

  <title>شاندیز میوه</title>
  <link rel="manifest" href="manifest.json?version=46"> <!-- Versioned -->

  <style>
    /* Splash screen container */
    .splash-container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh; /* تنظیم ارتفاع به اندازه کل صفحه */
    }

    .splash-text img {
      width: 250px; /* سایز متوسط برای تصویر */
      height: auto; /* تناسب حفظ شود */
    }

    /* General styles */
    body, html {
      margin: 0;
      padding: 0;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      background-color: #ffffff;
      color: white;
      font-family: Arial, sans-serif;
      overflow: hidden;
    }

    /* Splash screen container */
    .splash-container {
      text-align: center;
      animation: fadeOut 2s ease-in-out 3s forwards;
    }

    /* Text animation */
    .splash-text {
      font-size: 2rem;
      font-weight: bold;
      opacity: 0;
      animation: fadeIn 2s ease-in-out forwards, scaleUp 2s ease-in-out 0.5s forwards;
    }

    /* Keyframes for fade in animation */
    @keyframes fadeIn {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }

    /* Keyframes for scaling the text */
    @keyframes scaleUp {
      0% {
        transform: scale(0.8);
      }
      100% {
        transform: scale(1.2);
      }
    }

    /* Keyframes for fade out the whole splash */
    @keyframes fadeOut {
      0% {
        opacity: 1;
      }
      100% {
        opacity: 0;
        visibility: hidden;
      }
    }

    .no-internet-message {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      background-color: rgba(0, 0, 0, 0.8); /* پس‌زمینه مشکی */
      color: white; /* رنگ متن سفید */
      padding: 10px;
      text-align: center;
      font-size: 18px;
      display: none; /* به طور پیش‌فرض مخفی است */
    }
  </style>

  <script>
    const serviceWorkerVersion = ""2827488426""; // Auto-injected by Flutter build process

    // Check and handle internet connection status
    function checkInternetConnection() {
       const messageElement = document.getElementById('no-internet-message');
       if (!navigator.onLine) {
         messageElement.style.display = 'block';
       } else {
         messageElement.style.display = 'none';
       }
    }

    // Add listeners for online and offline events
    window.addEventListener('online', checkInternetConnection);
    window.addEventListener('offline', checkInternetConnection);

    // Initial check when page loads
    window.addEventListener('load', checkInternetConnection);

    function hideSplashScreen() {
      const splashContainer = document.getElementById('splash-container');
      if (splashContainer) {
        splashContainer.style.display = 'none';
      }
    }

    // Hide splash screen after Flutter's first frame is ready
    window.addEventListener('flutter-first-frame', function() {
      hideSplashScreen();
    });

    // Cache busting logic
    function clearCache() {
      if ('caches' in window) {
        caches.keys().then(function(names) {
          for (let name of names) {
            caches.delete(name);
          }
        });
      }
    }

    if ('serviceWorker' in navigator) {
      navigator.serviceWorker.getRegistrations().then(function(registrations) {
        for (let registration of registrations) {
          registration.unregister().then(clearCache);
        }
      });
    }

    window.addEventListener('load', function() {
      if ('serviceWorker' in navigator) {
        const seconds = new Date().getTime();
        var xmlhttp = new XMLHttpRequest();
        xmlhttp.open("GET", 'version.json?version=46' + seconds, true);
        xmlhttp.onload = function() {
          if (xmlhttp.status === 200) {
            const remoteVersion = xmlhttp.responseText;
            const localVersion = window.localStorage.getItem('buildNumber');
            if (localVersion !== remoteVersion) {
              clearCache();
              window.localStorage.setItem('buildNumber', remoteVersion);
            }
          }
        };
        xmlhttp.send();
      }
    });
  </script>
  <script type="text/javascript">
    window.flutterWebRenderer = "html";
</script>
  
</head>

<!-- <script>
  function openUrl(url, target) {
    window.open(url, target);
  }
</script> -->
<body>
<!-- Animated Text Splash Screen -->

<div class="splash-container" id="splash-container">
  <div class="splash-text">
    <img src="icons/logo.png" alt="Splash Image">
  </div>
</div>

<!-- Internet disconnected message -->
<div id="no-internet-message" class="no-internet-message">
  No Internet Connection
</div>

<script src="flutter_bootstrap.js?version=46" async></script> <!-- Versioned -->

</body>
</html>

flutter doctor检测截图:
flutter doctor检测截图1
flutter doctor检测截图2

内容的提问来源于stack exchange,提问作者Amin Azizzadeh

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.13 19:47:32