Tag: vscode

Announcing OpenXML Package Explorer for VS Code

Categories Blog8 Comments on Announcing OpenXML Package Explorer for VS Code

I am excited to announce my new project “OpenXML Package Explorer” extension for Visual Studio Code.

It allows to explore content of Office Open XML packages (*.pptx, *.docx, *.xlsx) inside Visual Studio Code. You can open any valid OpenXML package in Tree View, explore parts inside package, their relationships and content of xml parts (pre-formatted xml with highlighting).

Extension is inspired by windows-only PackageExplorer (lost in CodePlex archive) and Open XML Package Editor for Modern Visual Studios (Visual Studio for Windows) but implemented on top of .NET 5 using F#, Fable, Fable.Remoting, and re-using some pieces from Ionide.

How it works

I believe that source code of this extension can be used as one more sample of Fable-powered VSCode extension. Here is how it currently works:

  1. F# source code compiled to JS using Fable 3 and bundled with webpack.
  2. Code that interacts with OpenXML packages is written in .NET and uses the latest version of System.IO.Packaging
  3. When extension is activated it starts .NET 5 process with API exposed using Fable.Remoting.
  4. Extension assumes that .NET 5 runtime is installed on user machine but it depends on .NET Install Tool for Extension Authors that should help to install runtime to users that do not have it yet.
  5. JS bundle runs inside Node.js VS Code Extension Host process.
  6. Fable.Remoting.Client cannot be used, because it is built on top of XMLHttpRequest that does not exist in Node.js world. Here is feature request for Fable.Remoting.NodeClient that may become a thing one day.
  7. Current client-server communication is built on top of axios library and Fable.Axios bindings with manually written client.
  8. Extension is created using LambdaFactory/fable-vscode-demo sample that uses ionide/ionide-vscode-helpers with bindings for VS Code Extension API.

P.S. Many thanks for Krzysztof Cieślak and Ionide team for ionide-vscode-fsharp, ionide-vscode-helpers and fable-vscode-demo and Stef Levesque for vscode-zipexplorer used as reference implementation and inspiration.