Flutter web 在构建模式下显示空白屏幕

Question

在 Flutter 上完成我的网络应用程序后，我尝试通过 flutter build web 命令在服务器上发布它。我将文件上传到服务器，但出现空白屏幕。 在 Android Studio 的调试模式下，它工作正常。 当我使用命令flutter run -d chrome --profile --verbose 时，我也得到相同的空白屏幕我在这里发现了类似的问题，但根本原因似乎每次都不同，对我没有任何效果，你能建议吗？

以下是我的颤振代码的简化版本，遇到了同样的问题：

import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:flutter_signin_button/flutter_signin_button.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  //await Firebase.initializeApp();
  ErrorWidget.builder = (FlutterErrorDetails details) {
    bool inDebug = false;
    assert(() { inDebug = true; return true; }());
    // In debug mode, use the normal error widget which shows
    // the error message:
    if (inDebug)
      return ErrorWidget(details.exception);
    // In release builds, show a yellow-on-blue message instead:
    return Container(
      alignment: Alignment.center,
      child: Text(
        'Error! ${details.exception}',
        style: TextStyle(color: Colors.yellow),
        textDirection: TextDirection.ltr,
      ),
    );
  };
  // Here we would normally runApp() the root widget, but to demonstrate
  // the error handling we artificially fail:
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
          scrollBehavior: MyCustomScrollBehavior(), //fixing the scrolling for web
          home:LoginScreen(),


          theme: ThemeData(
            cupertinoOverrideTheme: CupertinoThemeData( // <---------- this
              textTheme: CupertinoTextThemeData(
                pickerTextStyle: TextStyle(color: Colors.white, fontWeight: FontWeight.w900),
              ),
            ),

          ),
        );

//
  }
}
class MyCustomScrollBehavior extends MaterialScrollBehavior {
  // Override behavior methods and getters like dragDevices
  @override
  Set<PointerDeviceKind> get dragDevices => {
    PointerDeviceKind.touch,
    PointerDeviceKind.mouse,
    // etc.
  };
}
class LoginScreen extends StatefulWidget {

  @override
  State<LoginScreen> createState() => _LoginScreenState();

}

class _LoginScreenState extends State<LoginScreen> {
  late String em;
  late String pa;
  @override
  void initState() {
    // TODO: implement initState
    super.initState();

  }
  @override
  Widget build(BuildContext context) {
    return Material(
        child: Scaffold(
              body: buildHomeScreen()
          ),
        );
  }

  Widget buildHomeScreen(){
   return Container(
      decoration: BoxDecoration(color: Colors.amberAccent),
      child: Flexible(
        child: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Align(alignment: Alignment.centerLeft,
                  child: WelcomeText('Get to know the highest rated cars,')),
              Align(alignment: Alignment.centerLeft,child: WelcomeText('good and bad things for each car,')),
              Align(alignment: Alignment.centerLeft,child: WelcomeText('best car mechanics near you,')),
              Align(alignment: Alignment.centerLeft,child: WelcomeText('best car agencies,')),
              Align(alignment: Alignment.centerLeft,child: WelcomeText('and more..')),
              SizedBox(height: 100,),
              Text('Welcome to Car of your Dreams', style: GoogleFonts.ubuntu(
                  textStyle: TextStyle(fontSize: 35,
                      color: Colors.white,
                      fontWeight: FontWeight.w500,
                      decoration: TextDecoration.none))),
              SizedBox(height: 8,),
              Text('Sign in to continue', style: GoogleFonts.ubuntu(
                  textStyle: TextStyle(fontSize: 14,
                      color: Colors.white,
                      fontWeight: FontWeight.w300,
                      decoration: TextDecoration.none))),
              SizedBox(height: 12,),
              FractionallySizedBox(
                widthFactor: 0.6,
                child: TextField(
                  onChanged: (value){
                  }
                  ,
                  decoration: InputDecoration(
                    hintText: "Email",
                    border: OutlineInputBorder(),
                    icon:Icon(Icons.email),
                    contentPadding: EdgeInsets.symmetric(horizontal: 20),
                  ),
                ),
              ),
              SizedBox(height: 5,),
              FractionallySizedBox(
                  widthFactor: 0.6,
                  child: TextField(
                      obscureText:true ,
                      onChanged: (value){
                      },
                      decoration: InputDecoration(
                        hintText: "Password",

                        border: OutlineInputBorder(),
                        icon:Icon(Icons.vpn_key_outlined),
                        contentPadding: EdgeInsets.symmetric(horizontal: 20),))
              ),
              SizedBox(height: 10,),
              Row(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  TextButton(onPressed: () {},
                    child: Text('Sign in', style: GoogleFonts.londrinaSolid(
                        textStyle: TextStyle(fontSize: 25,
                            color: Colors.white,
                            fontWeight: FontWeight.w300,
                            decoration: TextDecoration.none))),),
                  SizedBox(width: 10,),
                  Icon(Icons.arrow_forward, color: Colors.white,)
                ],
              ),
              SizedBox(height: 10,),
              SignInButton(Buttons.Google,
                  text: "Sign in with Google",
                  onPressed:(){}),
              SizedBox(height: 7,),
              SignInButton(Buttons.Facebook,
                  text: "Sign in with Facebook",
                  onPressed: (){}),
              SizedBox(height: 7,),
              TextButton(
                onPressed: (){
                  Navigator.pushNamed(context, '-1');
                },
                child: Text('New user? Register..', style: GoogleFonts.londrinaSolid(
                    textStyle: TextStyle(fontSize: 20,
                        color: Colors.white,
                        fontWeight: FontWeight.w300,
                        decoration: TextDecoration.none))),),
              SizedBox(height: 50,),

            ],
          ),
        ),
      ),
    );
  }

}

class WelcomeText extends StatelessWidget {
  WelcomeText(this.welcomeText) ;
  String welcomeText;
  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.fromLTRB(20.0,0,0,0),
      child: Text(welcomeText,
          style: GoogleFonts.permanentMarker(
              textStyle: TextStyle(fontSize: 30,
                  color: Colors.white70,
                  fontWeight: FontWeight.w100,
                  decoration: TextDecoration.none))),
    );
  }
}

编辑：我在调试模式下运行代码后添加了日志，请参见下文。我可以看到它运行但抱怨灵活的小部件，这可能是问题吗？ 以调试模式在 Chrome 上启动 lib\main.dart... 正在等待来自 Chrome 上的调试服务的连接... 此应用程序链接到调试服务：ws://127.0.0.1:60918/FkBvyNxPDmI=/ws 调试服务监听 ws://127.0.0.1:60918/FkBvyNxPDmI=/ws

以可靠的零安全性运行 调试服务监听 ws://127.0.0.1:60918/FkBvyNxPDmI=/ws

======== 小部件库捕获的异常=================================== ===================== 应用父数据时引发以下断言： ParentDataWidget 使用不正确。

ParentDataWidget Flexible(flex: 1) 想要将 FlexParentData 类型的 ParentData 应用到 RenderObject，该 RenderObject 已设置为接受 ParentData 类型不兼容的 ParentData。

通常，这意味着灵活小部件具有错误的祖先 RenderObjectWidget。通常，Flexible 小部件直接放置在 Flex 小部件中。 有问题的 Flexible 当前放置在 DecoratedBox 小部件中。

接收到不兼容父数据的 RenderObject 的所有权链是： RepaintBoundary ← NotificationListener ← NotificationListener ← _MaterialScrollbar ← Scrollbar ← Scrollable ← PrimaryScrollController ← SingleChildScrollView ← Flexible ← DecoratedBox ← ⋯ 抛出异常时，这是堆栈： C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/internal/js_dev_runtime/private/ddc_runtime/errors.dart 251:49 throw 包/flutter/src/widgets/framework.dart 5753:11 packages/flutter/src/widgets/framework.dart 5768:14 [_updateParentData]

Answer 1

如果你看到一个空白的灰色屏幕，可能你的代码中某处有一个空值，检查你的值是否为空值