singerdmx / flutter-quill

Rich text editor for Flutter
https://pub.dev/packages/flutter_quill
MIT License
2.52k stars 801 forks source link

Cannot build to WASM with flutter_quill #1889

Open shechren opened 3 months ago

shechren commented 3 months ago

Is there an existing issue for this?

The question

https://docs.flutter.dev/platform-integration/web/wasm

I found a problem when i was built to Web in WASM. So i check the flutter pub deps and found the reason. that flutter_keyboard_visibility_web wasn't updated (dart:html to web) and I think it's uncertainly to will be done. However please tell me how can I dodge this problem within use the flutter_quill till flutter_keyboard_Visibility_web's update.

log is as follows:

Target dart2wasm failed: ProcessException: Process exited abnormally with exit code 64:
*NOTE*: Compilation to WasmGC is experimental.
The support may change, or be removed, with no advance notice.

../../AppData/Local/Pub/Cache/hosted/pub.dev/flutter_keyboard_visibility_web-2.0.0/lib/flutter_keyboard_visibility_web.dart:1:8: Error: Dart library 'dart:html' is not available on
this platform.
import 'dart:html' as html show window, Navigator;
       ^
Context: The unavailable library 'dart:html' is imported through these packages:

    web_plugin_registrant.dart => package:flutter_keyboard_visibility_web => dart:html

Detailed import paths for (some of) the these imports:

    main.dart => web_plugin_registrant.dart => package:flutter_keyboard_visibility_web/flutter_keyboard_visibility_web.dart => dart:html

../../AppData/Local/Pub/Cache/hosted/pub.dev/flutter_keyboard_visibility_web-2.0.0/lib/flutter_keyboard_visibility_web.dart:10:35: Error: Type 'html.Navigator' not found.
  FlutterKeyboardVisibilityPlugin(html.Navigator navigator);
                                  ^^^^^^^^^^^^^^
../../AppData/Local/Pub/Cache/hosted/pub.dev/flutter_keyboard_visibility_web-2.0.0/lib/flutter_keyboard_visibility_web.dart:10:40: Error: 'Navigator' isn't a type.
  FlutterKeyboardVisibilityPlugin(html.Navigator navigator);
                                       ^^^^^^^^^
../../AppData/Local/Pub/Cache/hosted/pub.dev/flutter_keyboard_visibility_web-2.0.0/lib/flutter_keyboard_visibility_web.dart:16:46: Error: Undefined name 'window'.
        FlutterKeyboardVisibilityPlugin(html.window.navigator);
                                             ^^^^^^
  Command: C:\src\flutter\bin\cache\dart-sdk\bin\dart.exe compile wasm --packages=.dart_tool/package_config.json
  --extra-compiler-option=--dart-sdk=C:\src\flutter\bin\cache\dart-sdk --extra-compiler-option=--platform=C:\src\flutter\bin\cache\flutter_web_sdk\kernel\dart2wasm_platform.dill   
  --extra-compiler-option=--delete-tostring-package-uri=dart:ui --extra-compiler-option=--delete-tostring-package-uri=package:flutter --extra-compiler-option=--import-shared-memory
  --extra-compiler-option=--shared-memory-max-pages=32768 -Ddart.vm.product=true
  -DFLUTTER_WEB_CANVASKIT_URL=https://www.gstatic.com/flutter-canvaskit/b4bfd459865a8d636f26aca0d330ae297c006c3c/ -DFLUTTER_WEB_AUTO_DETECT=false -DFLUTTER_WEB_USE_SKIA=false      
  -DFLUTTER_WEB_USE_SKWASM=true --extra-compiler-option=--depfile=C:\Users\shech\flutter\daewon_robotics\.dart_tool\flutter_build\4d0ac41d84c133905335851b559ddbb9\dart2wasm.d -O4  
  --no-name-section -o C:\Users\shech\flutter\daewon_robotics\.dart_tool\flutter_build\4d0ac41d84c133905335851b559ddbb9\main.dart.wasm
  C:\Users\shech\flutter\daewon_robotics\.dart_tool\flutter_build\4d0ac41d84c133905335851b559ddbb9\main.dart
#0      RunResult.throwException (package:flutter_tools/src/base/process.dart:125:5)
#1      _DefaultProcessUtils.run (package:flutter_tools/src/base/process.dart:321:19)
<asynchronous suspension>
#2      Dart2WasmTarget.build (package:flutter_tools/src/build_system/targets/web.dart:329:5)
<asynchronous suspension>
#3      _BuildInstance._invokeInternal (package:flutter_tools/src/build_system/build_system.dart:875:9)
<asynchronous suspension>
#4      Future.wait.<anonymous closure> (dart:async/future.dart:524:21)
<asynchronous suspension>
#5      _BuildInstance.invokeTarget (package:flutter_tools/src/build_system/build_system.dart:813:32)
<asynchronous suspension>
#6      Future.wait.<anonymous closure> (dart:async/future.dart:524:21)
<asynchronous suspension>
#7      _BuildInstance.invokeTarget (package:flutter_tools/src/build_system/build_system.dart:813:32)
<asynchronous suspension>
#8      FlutterBuildSystem.build (package:flutter_tools/src/build_system/build_system.dart:642:16)
<asynchronous suspension>
#9      WebBuilder.buildWeb (package:flutter_tools/src/web/compile.dart:92:34)
<asynchronous suspension>
#10     BuildWebCommand.runCommand (package:flutter_tools/src/commands/build_web.dart:230:5)
<asynchronous suspension>
#11     FlutterCommand.run.<anonymous closure> (package:flutter_tools/src/runner/flutter_command.dart:1394:27)
<asynchronous suspension>
#12     AppContext.run.<anonymous closure> (package:flutter_tools/src/base/context.dart:153:19)
<asynchronous suspension>
#13     CommandRunner.runCommand (package:args/command_runner.dart:212:13)
<asynchronous suspension>
#14     FlutterCommandRunner.runCommand.<anonymous closure> (package:flutter_tools/src/runner/flutter_command_runner.dart:372:9)
<asynchronous suspension>
#15     AppContext.run.<anonymous closure> (package:flutter_tools/src/base/context.dart:153:19)
<asynchronous suspension>
#16     FlutterCommandRunner.runCommand (package:flutter_tools/src/runner/flutter_command_runner.dart:308:5)
<asynchronous suspension>
#17     run.<anonymous closure>.<anonymous closure> (package:flutter_tools/runner.dart:130:9)
<asynchronous suspension>
#18     AppContext.run.<anonymous closure> (package:flutter_tools/src/base/context.dart:153:19)
<asynchronous suspension>
#19     main (package:flutter_tools/executable.dart:93:3)
<asynchronous suspension>

Compiling lib\main.dart for the Web...                             62.8s
Error: Failed to compile application for the Web.
Adrian0012 commented 3 months ago

Yeahhhh...not sure how this will play out but looking at flutter_keyboard_visibility_web: ^2.0.0 there has not been any updates in years and the likely hood of quill to undergo some big migration just so we can build with wasm.

dxvid-pts commented 3 months ago

dart:html is superceeded by package:web. See https://dart.dev/interop/js-interop/package-web, https://docs.flutter.dev/platform-integration/web/wasm and this talk (https://www.youtube.com/watch?v=qx42r29HhcM) for more information.

A migration can also be done partially.

Adrian0012 commented 3 months ago

application

You can't dodge it. Quill has the keyboard package as dependency, hence until the keyboard package gets updated and quill updates the dependency as well you are kinda stuck.

dxvid-pts commented 3 months ago

True, we are dependent on the keyboard package but quill itself could be updated in the meantime:)

putnokiabel commented 2 months ago

True, we are dependent on the keyboard package but quill itself could be updated in the meantime:)

Yep, as long as flutter_quill itself does not use html (which it currently does), you could easily add a dependency_override for flutter_keyboard_visibility_web (as it has a PR ready for wasm support already)

dxvid-pts commented 2 months ago

True, we are dependent on the keyboard package but quill itself could be updated in the meantime:)

Yep, as long as flutter_quill itself does not use html (which it currently does), you could easily add a dependency_override for flutter_keyboard_visibility_web (as it has a PR ready for wasm support already)

Exactly

dxvid-pts commented 2 months ago

@singerdmx is there a reason this was closed? I could not find any PR for this and flutter_quill still depends on the html package

dxvid-pts commented 2 months ago

I already migrated a few open-source packages to package:web. If help is needed I can help.

rsegecin commented 1 month ago

@singerdmx is there a reason this was closed? I could not find any PR for this and flutter_quill still depends on the html package

I believe he was referring to this pull request: https://github.com/MisterJimson/flutter_keyboard_visibility/pull/155. raldhafiri has already worked on getting flutter_keyboard_visibility to compile for ASM and is waiting for this PR to be merged into the MisterJimson repository. As a workaround, while MisterJimson hasn't updated his package yet, you can add the following to your pubspec.yaml to use raldhafiri's version:

dependency_overrides:
flutter_keyboard_visibility_web:
    git:
    url: https://github.com/raldhafiri/flutter_keyboard_visibility.git
    ref: master
    path: flutter_keyboard_visibility_web