Livebook inside regular editor

Hey, I was using jupyter notebooks and discovered that I was able to use it inside VS Code, with GitHub Copilot and it was a great experience. Do you know if there is something similar for Livebook or something like that for the future?

1 Like

This exists as GitHub - josecfreittas/vscode-livebook: An extension to add support for `.livemd` files and run a Livebook instance inside your VSCode but it was archived. One of the known issues was that Livebook can’t live inside an iframe but I believe Livebook is already using iframes. There may be compatibility issues as iframe within an iframe can be problematic.

I haven’t used that extension very much but it was rather functional when I used it in early 2022. Livebook internals have made some shifts that may make it worth reviving the plugin.

I’d also love more official guidance as I have numerous ideas for embedding but haven’t worked through all the limitations.

1 Like

I created an issue for better external support about 2 years ago, but it was closed because that was not the most important priority then. Maybe if we reopen there might be more interest?

Livebooks run inside iframes now, so folks can give it a try again. :slight_smile: but we are a small team and it is still unlikely we can prioritize this, but it is more likely we can provide support for those willing to navigate these waters.


Hey Jose, it should be something that I would try in terms of contribution but my pace would be definitely slow

@josevalim Is there perhaps a way to only watch the file for updates so we can edit in another editor, but see the updates in Livebook?

This has been asked a couple times in the issues tracker. The answer is no because it plays against Livebook features, such as notebook signing for security, secret management, etc.

Thanks, I’d looked in the PRs/Issues but hadn’t seen the discussions. I see them now.

I’m wondering these days If it would be possible to use something like LiveState to connect VS Code and a Livebook process, just speculating

In case anyone is (still) interested in using LiveBooks embedded inside vscode like that, I’ve just made a new extension based on the now available settings for embedding LiveBooks in an iframe, it’s here:

I mainly wanted it so I could open .livemd files directly from within my project.
It can also automatically attach to a running node based on workspace configuration, so you could set it up to always open notebooks attached to your mix project for you workspace.


Keep in mind it’s just an iframe embed. A big issue I’m just noticing now is this:

Which is quite annoying. Might have to rethink whether the extension makes sense like this…
May have to play around with forking livebook and modifying it to forward events from the iframe up to the host.

Edit: I’ve solved this by forking livebook with a small addition of some JavaScript to forward events to the iframe host.

Not ideal and there are still some issues when switching focus but it will do for now for my use case at least.

1 Like