This starter includes:
- 🖥️ TypeScript code to create a simple
NotebookOutputRenderer - 📦 A Webpack build for renderer client code
- ⚡ Support for hot module reloading and safe boilerplate
- 🎨 CSS modules support
cd notebook-renderer-react-samplecode-insiders .: Open the folder in VS Code Insiders- Hit
F5to build+debug
A Notebook Renderer consists of code that runs in the VS Code Extension Host (Node.js), which registers the renderer and passes data into the UI code running inside a WebView (Browser/DOM).
This uses TypeScript project references. There are three projects in the src directory:
extensioncontains the code running in Node.js extension host. It's compiled withtsc.clientis the UI code, built by Webpack, with access to the DOM.commoncontains code shared between the extension and client.
When you run watch, compile, or dev, we invoke both tsc and webpack to compile the extension and the client portion of the code.