Log in
product

Bundling Javascript in Swift projects using ESBuild

SwiftyESBuild: Streamlining Swift Web Bundling and JavaScript Integration for Effortless Development.

In an ongoing effort to streamline the process of building web apps and sites with Swift, I am delighted to introduce a new Swift Package: SwiftyESBuild. While modern browsers are capable of resolving and downloading ES module graphs, many projects still resort to bundling for various reasons, such as optimizing loading speed and supporting modern JavaScript features that may not be compatible with certain browsers. Nowadays, there is an abundance of tools available to assist with this task, but one tool, in particular, has gained significant popularity and serves as a foundational block for other tools like Vite, ESBuild.

Communities like JavaScript's or Ruby's have already discovered a seamless installation path (e.g. jsbundling-rails) that doesn't require the installation of additional runtimes like Node. Unfortunately, the Swift community lacks a similar streamlined method to integrate it into projects powered by frameworks like Vapor or Publish. This is where SwiftyESBuild comes in. By adding SwiftyESBuild as a dependency through a Swift Package, you can effortlessly incorporate the tool into your project. With just a few lines of code, you can use it to generate production-ready artifacts or keep it running in the background, automatically monitoring for any file changes.

Getting started

To get started with SwiftyESBuild, all you have to do is add the dependency to your project:

.package(url: "https://github.com/tuist/SwiftyESBuild.git", .upToNextMinor(from: "0.1.0"))

After adding the dependency, you'll need to create an instance of SwiftyESBuild:

let esbuild = SwiftyESBuild(version: .latest)

If you don't pass any arguments, it defaults to the latest version in the system's default temporary directory. If you're working in a team, we recommend fixing the version to minimize non-determinism across environments.

Running ESBuild

Running ESBuild is as easy as invoking the run function on the esbuild instance, passing the options you want to use:

import TSCBasic // AbsolutePath let entryPointPath = AbsolutePath(validating: "/project/index.js") let outputBundlePath = AbsolutePath(validating: "/projects/build/index.js") try await esbuild.run(entryPoint: entryPointPath, options: .bundle, .outfile(outputBundlePath))

Check out SwiftyESBuild.RunOption to know the available options. Note that not all the options supported by ESBuild are available, which is why we've added an .arguments option that allows you to pass any argument to the ESBuild CLI.

Next steps

We'll add some examples for how to use the tool with frameworks like Vapor and Publish. Additionally, we plan to build a Swift Package to integrate Orogene into Swift projects. This will allow developers to resolve and pull NPM packages without having to install Node in their system. It's the last missing step to have a fully integrated JavaScript bundling experience in Swift projects without requiring Node installation.

You might also like

Tuist 0.16.0 allows users to link system libraries and frameworks
From the just released 0.16.0 version of Tuist, users will be able to define dependencies with system libraries and frameworks from their targets. Moreover, we added support for customizing the list of input and output files in their target action, and generation of targets with no build settings at all. This version also ships with minor improvements and bug fixes that had been reported by users.
Introducing Tuist Ambassadors
We are introducing the Tuist Ambassadors program to recognize the people who have been going above and beyond to help others in the community.
Tuist 1.2.0 - Bugfixes, improvements and future direction
The newest release brings you many bugfixes and improvements. However with the number of contributors steadily growing the team has also been busy thinking and writing about the direction of Tuist. We have a rough plan for Tuist 2.0 and work has started on compiling a manifesto to explain a bit more about the goals and values of the project.

Supercharge your app development

Get started