# Building Flutter apps with newest Engine & newest Dart

## Modify the Flutter tools

Clone https://github.com/flutter/flutter. This repo contains the `flutter`
command line tool used to build Flutter apps. For building web apps it's using
the `dart compile wasm` command from the Dart SDK. We ensure it uses the Dart
SDK we built by patching the usages of the `dart` binary:

```
<flutter> % git diff
diff --git a/packages/flutter_tools/lib/src/artifacts.dart b/packages/flutter_tools/lib/src/artifacts.dart
index ba3703b86e..e0fb968fab 100644
--- a/packages/flutter_tools/lib/src/artifacts.dart
+++ b/packages/flutter_tools/lib/src/artifacts.dart
@@ -1174,6 +1174,7 @@ class CachedLocalEngineArtifacts implements Artifacts {
   }

   String _getDartSdkPath() {
+    return _dartSdkPath();
     final String builtPath = _fileSystem.path.join(_hostEngineOutPath, 'dart-sdk');
     if (_fileSystem.isDirectorySync(_fileSystem.path.join(builtPath, 'bin'))) {
       return builtPath;
@@ -1404,6 +1405,7 @@ class CachedLocalWebSdkArtifacts implements Artifacts {
   }

   String _getDartSdkPath() {
+    return _dartSdkPath();
     // If we couldn't find a built dart sdk, let's look for a prebuilt one.
     final String prebuiltPath = _fileSystem.path.join(_getFlutterPrebuiltsPath(), _getPrebuiltTarget(), 'dart-sdk');
     if (_fileSystem.isDirectorySync(prebuiltPath)) {
@@ -1522,8 +1524,9 @@ class OverrideArtifacts implements Artifacts {
 }

 /// Locate the Dart SDK.
 String _dartSdkPath(Cache cache) {
-  return cache.getRoot().childDirectory('dart-sdk').path;
+  return '<path-to-dart-sdk-checkout>/out/ReleaseX64/dart-sdk';
 }

 class _TestArtifacts implements Artifacts {
```

We then ensure the Flutter tool is re-built via

```
<flutter> % rm bin/cache/flutter_tools.snapshot
```

=> Next time one runs `flutter` it will re-build the Flutter command line tool.

## Modify the Flutter engine

Building Flutter apps requires not only the dart2wasm compiler but also the
platform file. As there may be dependencies (e.g. adding a member in core
libraries that the compiler has an intrinsic for) we also need to ensure the
core libraries are compiled with the same Dart version (resulting in a correct
`dart2wasm_platform.dill` file that also includes the `dart:ui` Flutter
library).

### Build it

Create an engine checkout with:

```
% mkdir engine
% cd engine
<engine> % fetch flutter
```

Edit `.gclient` to add the `download_emsdk` custom variable:

```
solutions = [
  {
    "custom_deps": {},
    "deps_file": "DEPS",
    "managed": False,
    "name": "src/flutter",
    "safesync_url": "",
    "url": "https://github.com/flutter/engine.git",
    "custom_vars" : {
      "download_emsdk": True,
    },
  },
]
```

Sync dependencies and download emsdk:

```
<src> % gclient sync -D
```

Then checkout the Dart version we want. If the commit is available in the Dart
checkout from `<src>/flutter/third_party/dart` then one may

```
<src> % vim flutter/DEPS

<...update Dart revision hash...>

<src> % gclient sync -D
```

but for local development one may just

```
<src> % cd flutter/third_party/dart
<src>/flutter/third_party/dart % git checkout ...
```

Now we have to make some modification to ensure that the build of the platform
file doesn't use the downloaded prebuilt SDK but the one in
`<src>/flutter/third_party/dart`, we do that by applying the following patch:

```
<src>/flutter % git diff
diff --git a/web_sdk/BUILD.gn b/web_sdk/BUILD.gn
index f1383ae321..caa8aac8f1 100644
--- a/web_sdk/BUILD.gn
+++ b/web_sdk/BUILD.gn
@@ -266,17 +266,21 @@ template("_compile_platform") {
       "--source",
       "dart:_web_locale_keymap",
     ]
-    if (flutter_prebuilt_dart_sdk) {
-      args += [
-        "--multi-root",
-        "file:///" + rebase_path("$host_prebuilt_dart_sdk/.."),
-      ]
-    } else {
-      args += [
-        "--multi-root",
-        "file:///" + rebase_path("$root_out_dir"),
-      ]
-    }
+    args += [
+      "--multi-root",
+      "file:///<path-to-your-dart-sdk>/out/ReleaseX64",
+    ]
   }
 }
```

Then build the release web engine via

```
<src> % flutter/lib/web_ui/dev/felt build
```

NOTE: If you modify the Dart sources, the incremental build may not work
correctly. You man want to `rm -rf <src>/out/wasm_release/flutter_web_sdk` or
`rm -rf <src>/out`.

## Build the Dart SDK

Build the normal Dart SDK in the same version as used in Flutter engine via
`tools/build.py -mrelease create_sdk`

NOTE: You can (after syncing dependencies with `gclient sync -D`) make
`<src>/flutter/third_party/dart` a symlink to the normal Dart SDK you work on. That
avoids the need to keep the two in sync.

## Building a Flutter app (e.g. Wonderous)

```
<path-to-flutter-app> % flutter                                  \
        --local-engine-src-path=<path-to-flutter-engine-src>     \
        --local-web-sdk=wasm_release                             \
        build web --wasm
```

=> This will now use the `flutter` tools with our custom `dart compile wasm` with a
custom `dart2wasm_platform.dill` file.