Building Your Very Own DevTools Extension
summary
Shows how to add a DevTools extension by shipping an extension folder and config.yaml in a package, plus a separate Flutter web app named like my_package_devtools_extension that compiles into the package build/dir. Uses the packages devtools_app_shared and devtools_extension, exposes ExtensionManager, ServiceManager and DTD manager to communicate with the VM, supports hot reload in debug, and requires a release step via dart run devtools_extension build and copy. Notes few packages currently adopt it despite FL 3.6 enabling extensions.
AI-written summary · about
chapters (14)
- 0:00Introduction
- 1:08Flutter DevTools history
- 3:14What are extensions
- 5:02Existing extensions
- 6:06Motivation for creating
- 7:13File structure
- 9:00Configuring with config.yaml
- 10:04Separating source files
- 11:27Key dependencies
- 13:12Building extension UI
- 14:14Debugging in simulator
- 15:18Building and deploying
- 16:23Resources and next steps
- 17:06Q&A
related talks
18mOptimize your productivity with Flutter developer tooling
26m"Build Your Own Devtools"
24mFearless Flutter Debugging: When All Else Fails, Hack the Tools!
28mA hero's guide to developing with Chrome Dev Tools
11mWhat are Docker Extensions
32mGetting Started Building Docker Extensions
50mExtensible devtools
58mWriting VS Code extensions for fun and profit