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 🙏

© 2024 – Pkg Stats / Ryan Hefner

node-gtk

v0.14.0

Published

GNOME Gtk+ bindings for NodeJS

Downloads

1,045

Readme

Node-Gtk is a gobject-introspection library for nodejs. It makes it possible to use any introspected library, such as Gtk+, usable. It is similar in essence to GJS or PyGObject. Please note this project is currently in a beta state and is being developed. Any contributors willing to help will be welcomed.

Supported Node.js versions: 16, 18 (other versions should work but are untested) Pre-built binaries available for: Linux, macOS (all supported versions except 18)

Table of contents

Usage

Below is a minimal example of how to use the code, but take a look at our template or at react-gtk to bootstrap your project.

const gi = require('node-gtk')
const Gtk = gi.require('Gtk', '3.0')

gi.startLoop()
Gtk.init()

const win = new Gtk.Window()
win.on('destroy', () => Gtk.mainQuit())
win.on('delete-event', () => false)

win.setDefaultSize(200, 80)
win.add(new Gtk.Label({ label: 'Hello Gtk+' }))

win.showAll()
Gtk.main()

See our examples folder for more examples, and in particular the browser demo source for a more complex application.

Documentation

Read our documentation here

Installing and building

Note that prebuilt binaries are available for common systems, in those cases building is not necessary.

Target Platforms
  • Linux: prebuilt binaries available
  • macOS: prebuilt binaries available
  • Windows: no prebuilt binaries

Requirements

  • git
  • nodejs@10 or higher
  • python3 (for node-gyp)
  • C compiler (gcc@8 or higher, or clang)

How to build on Ubuntu

Install basic dependencies.

sudo apt-get install \
  build-essential git \
  gobject-introspection \
  libgirepository1.0-dev \
  libcairo2 \
  libcairo2-dev

At this point npm install node-gtk should already install, fallback and build node-gtk without problems.

How to build on Fedora

Install basic dependencies:

sudo dnf install \
  @development-tools \
  nodejs \
  gobject-introspection \
  gtk3 \
  cairo

After installing of packages, run npm install node-gtk.

How to build on ArchLinux

The following should be the bare minimum to be able to build the project.

pacman -S --needed \
  base-devel git \
  nodejs npm \
  gtk3 gobject-introspection \
  cairo

Feel free to install all base-devel utilities.

After installing those packages, npm install node-gtk would do.

How to build on macOS

Assuming you have brew installed, the following has been successfully tested on El Captain.

brew install git node gobject-introspection gtk+3 cairo

At this point npm install node-gtk should already install, fallback and build node-gtk without problems.

How to build on Windows

Mandatory dependency is Visual C++ Build Environment: Visual Studio Build Tools (using "Visual C++ build tools" workload) or Visual Studio Community (using the "Desktop development with C++" workload).

The easiest/tested way to build this repository is within a MinGW shell provided by the MSYS2 installer.

Once VS and its C++ compiler is available and MSYS2 installed, launch the MinGW shell.

# update the system
# in case of errors, wait for the update to complete
# then close and open again MingW shell
pacman -Syyu --noconfirm

# install git, gtk3 and extra dependencie
pacman -S --needed --noconfirm git mingw-w64-$(uname -m)-{gtk3,gobject-introspection,pkg-config,cairo}

# where to put the repository clone?
# pick your flder or use ~/oss (Open Source Software)
mkdir -p ~/oss/
cd ~/oss

# clone node-gtk there
git clone https://github.com/romgrk/node-gtk
cd node-gtk

# don't include /mingw64/include directly since it conflicts with
# Windows SDK headers. we copy needed headers to __extra__ directory:
./windows/mingw_include_extra.sh

# if MSYS2 is NOT installed in C:/msys64 run:
export MINGW_WINDOWS_PATH=$(./windows/mingw_windows_path.sh)

# first run might take a while
GYP_MSVS_VERSION=2017 npm install

The GYP_MSVS_VERSION could be 2017 or above. Please verify which version you should use

The below blog post series will help you get started:

  1. Node.js GTK Hello World on Windows
  2. Find DLLs and Typelibs dependencies for Node.js GTK Application on Windows
  3. Package Node.js GTK Application on Windows

Possible issue on MinGW shell

In case you are launching the general executable without knowing the correct platform, the binary path might not be available.

In such case python won't be available either, and you can check via which python command.

If not found, you need to export the platform related binary path:

# example for the 32bit version
export PATH="/mingw32/bin:$PATH"
npm run install

This should do the trick. You can also check if there is any python at all via pacman -Qs python.

Testing the project

If you'd like to test everything builds and work properly, after installing and building you can run any of the examples:

node ./examples/hello-gtk.js

If you'll see a little window saying hello that's it: it works!

Please note in macOS the window doesn't automatically open above other windows. Try Cmd + Tab if you don't see it.

Browser demo

If you'd like to test ./examples/browser.js you'll need WebKit2 GTK+ libary.

  • in Ubuntu, you can apt-get install libwebkit2gtk-3.0 (4.0 works too) and try it out.
  • in Fedora, you should run sudo dnf install webkit2gtk3
  • in ArchLinux, you can pacman -S --needed webkitgtk and try it out.
  • in macOS, there is no way to run it right now because webkitgtk was removed from homebrew

Once installed, you can ./examples/browser.js google.com or any other page, and you might try the dark theme out too:

# macOS needs to have the Adwaita theme installed
# brew install adwaita-icon-theme

# Usage: ./examples/browser.js <url> [theme]
./examples/browser.js  google.com  dark

Contributing

If you'd like to help, we'd be more than happy to have support. To setup your development environment, you can run npm run configure. You can then build the project with npm run build.

  • https://developer.gnome.org/gi/stable/index.html
  • https://v8docs.nodesource.com/
  • https://github.com/nodejs/nan#api

Don't hesitate to join our Discord channel.

Contributors