Skip to content

Adopt Web Packages #102

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
samuel-williams-shopify merged 1 commit into from
Sep 8, 2026
Merged

Adopt Web Packages #102

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions context/integrating-with-javascript.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,15 @@ Import maps provide a modern way to manage JavaScript module dependencies. Utopi

### Installing JavaScript Libraries

Declare browser libraries as production dependencies in `package.json`. The `bake-node.packages` section selects the files that should be served and assigns their browser import names:
Declare browser libraries as production dependencies in `package.json`. The `web-packages.packages` section selects the files that should be served and assigns their browser import names:

```json
{
"private": true,
"dependencies": {
"@socketry/syntax": "^0.6.1"
},
"bake-node": {
"web-packages": {
"packages": {
"@socketry/syntax": {
"include": [
Expand All @@ -34,17 +34,17 @@ Declare browser libraries as production dependencies in `package.json`. The `bak
Install the dependencies using the configured package manager, then generate the browser-facing package projection:

```bash
$ bundle exec bake node:install
$ bundle exec bake node:packages:static
$ bundle exec bake web:packages:install
$ bundle exec bake web:packages:update
```

This installs dependencies into `node_modules/` and copies only the selected browser files into `public/_components/`. Treat both directories as generated projections rather than authored source.

Use an immutable installation and verify the checked-in projection in CI:

```bash
$ bundle exec bake node:install frozen=true
$ bundle exec bake node:packages:check
$ bundle exec bake web:packages:install frozen=true
$ bundle exec bake web:packages:check
```

### Creating the Import Map
Expand Down Expand Up @@ -96,9 +96,9 @@ Once the import map is set up, you can import and use the library in your script
</script>
```

Inspect the generated import map with `bundle exec bake node:importmap:show` when debugging package resolution.
Inspect the generated import map with `bundle exec bake web:packages:import_map:show` when debugging package resolution.

See the [Bake Node documentation](https://socketry.github.io/bake-node/) for workspace packages, package selection, and alternative package managers.
See the [Web Packages documentation](https://socketry.github.io/web-packages/) for workspace packages, package selection, and alternative package managers.

### Advanced Import Map Features

Expand Down
16 changes: 8 additions & 8 deletions guides/integrating-with-javascript/readme.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,15 +8,15 @@ Import maps provide a modern way to manage JavaScript module dependencies. Utopi

### Installing JavaScript Libraries

Declare browser libraries as production dependencies in `package.json`. The `bake-node.packages` section selects the files that should be served and assigns their browser import names:
Declare browser libraries as production dependencies in `package.json`. The `web-packages.packages` section selects the files that should be served and assigns their browser import names:

```json
{
"private": true,
"dependencies": {
"@socketry/syntax": "^0.6.1"
},
"bake-node": {
"web-packages": {
"packages": {
"@socketry/syntax": {
"include": [
Expand All @@ -34,17 +34,17 @@ Declare browser libraries as production dependencies in `package.json`. The `bak
Install the dependencies using the configured package manager, then generate the browser-facing package projection:

```bash
$ bundle exec bake node:install
$ bundle exec bake node:packages:static
$ bundle exec bake web:packages:install
$ bundle exec bake web:packages:update
```

This installs dependencies into `node_modules/` and copies only the selected browser files into `public/_components/`. Treat both directories as generated projections rather than authored source.

Use an immutable installation and verify the checked-in projection in CI:

```bash
$ bundle exec bake node:install frozen=true
$ bundle exec bake node:packages:check
$ bundle exec bake web:packages:install frozen=true
$ bundle exec bake web:packages:check
```

### Creating the Import Map
Expand Down Expand Up @@ -96,9 +96,9 @@ Once the import map is set up, you can import and use the library in your script
</script>
```

Inspect the generated import map with `bundle exec bake node:importmap:show` when debugging package resolution.
Inspect the generated import map with `bundle exec bake web:packages:import_map:show` when debugging package resolution.

See the [Bake Node documentation](https://socketry.github.io/bake-node/) for workspace packages, package selection, and alternative package managers.
See the [Web Packages documentation](https://socketry.github.io/web-packages/) for workspace packages, package selection, and alternative package managers.

### Advanced Import Map Features

Expand Down
6 changes: 3 additions & 3 deletions lib/utopia/import_map.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
require "json"
require "xrb"
require "protocol/url"
require "bake/node/manifest"
require "web/packages/manifest"

module Utopia
# Represents an import map for JavaScript modules with support for URI and relative path resolution.
Expand Down Expand Up @@ -56,11 +56,11 @@ module Utopia
#
# puts page_map.to_html
class ImportMap
# Load the import mappings from a Bake Node static package manifest.
# Load the import mappings from a Web Packages static projection manifest.
# @parameter root [String | Pathname] The static package output directory.
# @returns [ImportMap] A frozen import map using the manifest's public base URL.
def self.load_manifest(root)
manifest = Bake::Node::Manifest.load(root)
manifest = Web::Packages::Manifest.load(root)
base = Protocol::URL[manifest.data.fetch("base")]
imports = manifest.import_map.fetch("imports").transform_values do |value|
Protocol::URL[value].relative_to(base).to_s
Expand Down
6 changes: 6 additions & 0 deletions releases.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,11 @@
# Releases

## Unreleased

### Web Packages

Utopia now uses `web-packages` v0.2 after the project was renamed from `bake-node`. Applications should use the `web-packages` key in `package.json` and invoke package management through the `web:packages` Bake namespace. The generated `.manifest.json` format remains compatible.

## v3.0.6

### JavaScript Packages
Expand Down
2 changes: 1 addition & 1 deletion test/utopia/import_map.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
with ".load_manifest" do
it "loads generated imports while preserving relative rendering" do
Dir.mktmpdir do |root|
Bake::Node::Manifest.build(
Web::Packages::Manifest.build(
base: "/_components/",
imports: {
"example" => "/_components/example/example.js",
Expand Down
2 changes: 1 addition & 1 deletion utopia.gemspec
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ Gem::Specification.new do |spec|
spec.required_ruby_version = ">= 3.3"

spec.add_dependency "bake", "~> 0.20"
spec.add_dependency "bake-node"
spec.add_dependency "web-packages", "~> 0.2"
spec.add_dependency "concurrent-ruby", "~> 1.2"
spec.add_dependency "console", "~> 1.24"
spec.add_dependency "irb"
Expand Down
Loading