WebViewController shows error if I don't use cascade

When I write a WebViewController with cascade, it does not show an error.

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class HomeScreen extends StatelessWidget {
  HomeScreen({super.key});

  final controller = WebViewController()
    ..setJavaScriptMode(JavaScriptMode.unrestricted);
    

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: WebViewWidget(
        controller: controller,
      ),
    );
  }
}

But when I write code without cascade, flutter shows an error.

Does anyone know why?

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

class HomeScreen extends StatelessWidget {
  HomeScreen({super.key});

  final controller = WebViewController();
  controller.setJavaScriptMode(JavaScriptMode.unrestricted);
    

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: WebViewWidget(
        controller: controller,
      ),
    );
  }
}

Here is error messages

You are not inside a function there so you can't just execute lines of code there, only declarations of variables. By using the cascade it makes it part of the declaration. If you want to write it without cascade you could do it in the constructor for example, like

class HomeScreen extends StatelessWidget {
  HomeScreen({super.key}){
    controller.setJavaScriptMode(JavaScriptMode.unrestricted);
  }

  final controller = WebViewController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: WebViewWidget(
        controller: controller,
      ),
    );
  }
}

</details>