npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

webview-bun

v2.4.0

Published

Bun bindings for webview, a tiny library for creating web-based desktop GUIs.

Readme

webview-bun

bun bindings for webview

Webview is a tiny cross-platform library to make web-based GUIs for desktop applications.

Installation

To use a different version, see Development section below.

  • Debian-based systems: sudo apt install libgtk-4-1 libwebkitgtk-6.0-4
  • Arch-based systems: sudo pacman -S gtk4 webkitgtk-6.0
  • Fedora-based systems: sudo dnf install gtk4 webkitgtk6.0

To bundle a specific version, see Development section below.

The Microsoft Edge WebView2 runtime is required to be installed on the system for any version of Windows before Windows 11. To manually update or install the latest version, follow the steps here.

bun i webview-bun

Example

import { Webview } from "webview-bun";

const html = `
<html>
    <body>
        <h1>Hello from bun v${Bun.version} !</h1>
    </body>
</html>
`;

const webview = new Webview();

webview.setHTML(html);
webview.run();

For more examples, browse the examples folder of this repository.

Single-file executable

You can compile a single self-sufficient executable file for your webview app.

For example, let's create a single executable for the above To-Do app. Clone this repository and run,

bun build --compile --minify --sourcemap ./examples/todoapp/app.ts --outfile todoapp

[!TIP] By default, a terminal window will also open in the back when double-click opening the executable in Windows and macOS.

🪟 To hide it in Windows:

Download and run hidecmd.bat from this repository, provide the exe path when prompted.

🍎 To hide it in macOS:

Add the extension .app in the end of the above bun build command.

Cross-platform compilation

Bun now supports cross-compilation of single executable binaries. To cross compile your webview app for a different platform run,

bun build --compile --target=bun-windows-x64 --minify --sourcemap ./examples/todoapp/app.ts --outfile todoapp

See full list of supported targets.

Bun.serve with webview

If you run a web server it will block the main thread, but using workers you can run the webview window on another thread. Clone this repository then,

cd examples/webserver/
bun build --compile --minify --sourcemap ./index.ts ./worker.ts --outfile webserver

Extras

🪟 On windows, to add an icon to your exe file, checkout rcedit.

🍎 On macOS, to codesign your executable checkout the bun docs.

Documentation

Refer to the comments in the source code for full documentation.

Development

Please use bun pretty to automatically format all files.

Prerequisites

🪟 On Windows, you need C++ Build Tools:

  • Go to https://visualstudio.microsoft.com/downloads.
  • Scroll down > All Downloads > Tools for Visual Studio.
  • Download Build Tools for Visual Studio 2022 and run.
  • Select Desktop development with C++ and install.

🐧 On linux, you need following deps:

  • Debian-based: sudo apt install libgtk-4-dev libwebkitgtk-6.0-dev cmake ninja-build clang
  • Fedora-based: sudo dnf install gtk4-devel webkitgtk6.0-devel cmake ninja-build clang
  • Arch-based: sudo pacman -S cmake ninja clang

🍎 On macOS, you need following deps:

brew install cmake ninja clang

Building

  • Clone the repository along with the webview submodule.

    git clone --recurse-submodules https://github.com/tr1ckydev/webview-bun
    cd webview-bun
  • Build the library for your platform.

    Under the hood, it invokes webview's own cmake build system to compile the shared library file.

    bun run build
  • (Optional) Clear build cache and rebuild the library.

    bun clean
    bun run build

The compiled library file can be found inside the build folder.

Building for arm64 from x86_64

To create an arm64 shared library from a x86_64 host, checkout setupARM64.sh. DO NOT execute the file (the .sh extension has been kept for syntax highlighting), rather read the comments and copy and paste the commands line by line.

Customization

  • 🐧 For linux, if you want to use a different WebkitGTK version, change the cmake WEBVIEW_WEBKITGTK_API option in build.ts to one of the available values. Be sure to first install the corresponding version libraries.
  • 🪟 For windows, if you want to bundle a specific webview version instead of using the system installed one, set the cmake WEBVIEW_MSWEBVIEW2_VERSION option to one of the NuGet version strings.

Check out the webview build docs for more options.

Running

[!TIP] To use your own webview library, set the WEBVIEW_PATH environment variable with the path to your webview shared library file.

Run the following example to see it in action.

bun run examples/basic.ts

For more examples, browse the examples folder of this repository.

Credits

This repository is a port of webview_deno with various changes to work with the bun runtime.

License

This repository uses MIT license. See LICENSE for full license text.