Skip to content

docs(book): Add Part VIII — Scala.js and the NPM ecosystem (facades + Vite)#595

Merged
xerial merged 1 commit into
mainfrom
docs/book-npm-vite
Jun 20, 2026
Merged

docs(book): Add Part VIII — Scala.js and the NPM ecosystem (facades + Vite)#595
xerial merged 1 commit into
mainfrom
docs/book-npm-vite

Conversation

@xerial

@xerial xerial commented Jun 20, 2026

Copy link
Copy Markdown
Member

Adds a new Part VIII to The Uni Book on using the JavaScript/npm ecosystem from a Scala.js Uni app — without ScalablyTyped, as requested.

Chapters

  • Ch 12 — Calling NPM Modules from Scala.js: hand-written facades with @js.native + @JSImport (default vs named exports), the js.* type vocabulary, the js.Dynamic escape hatch, and a clear-eyed why not ScalablyTyped (a few honest lines beat a generated TS→Scala library for the handful of calls a real app makes).
  • Ch 13 — Bundling with Vite: ModuleKind.ESModule so @JSImport emits real imports; npm install; a main.js entry that loads the Scala.js output and lets Vite resolve the bare imports; and the two real-world escape hatches — the @JSGlobal + window bridge and resolve.alias for browser-hostile transitive deps.

Grounded in real code

Patterns come from the wvlet-ui-playground reference you pointed to:

  • the verified Koffi.scala facade (@JSImport("koffi", JSImport.Default)),
  • the playground's vite.config.js (resolve.alias koffi→stub, base: "./"), main.js (window.MonacoEditor bridge, dynamic import of the Scala.js output), and package.json,
  • ModuleKind.ESModule confirmed against both uni's and wvlet's build.sbt.

Wiring

  • New Part VIII in the book ToC and the /book/ sidebar.
  • Nav re-threaded: ch11 → 12 → 13 → appendices (ch11 closing and appendix-A prev updated accordingly).
  • pnpm docs:build passes (dead-link-clean).

🤖 Generated with Claude Code

Two new chapters on using JavaScript libraries from a Scala.js Uni app,
without ScalablyTyped:

- ch12 Calling NPM Modules — hand-written facades with @js.native +
  @jsimport (default vs named exports), js.* types, the js.Dynamic escape
  hatch, and why a few honest lines beat a generated TS-to-Scala library.
- ch13 Bundling with Vite — ModuleKind.ESModule so @jsimport emits real
  imports; npm install; a main.js entry that loads the Scala.js output;
  the @jsglobal+window bridge and resolve.alias escape hatch for stubborn
  modules.

Patterns are grounded in the wvlet-ui-playground reference (vite.config,
main.js window-bridge, koffi alias stub) and the verified Koffi.scala
facade; ESModule linker config confirmed against uni's own build.

Wires Part VIII into the ToC and /book/ sidebar, and re-threads the nav
(ch11 → 12 → 13 → appendices). pnpm docs:build passes.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@github-actions github-actions Bot added the doc Improvements or additions to documentation label Jun 20, 2026

@gemini-code-assist gemini-code-assist Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code Review

This pull request introduces Part VIII to the documentation, adding Chapter 12 on writing hand-written Scala.js facades for npm modules and Chapter 13 on bundling Scala.js ES modules with Vite. Feedback on the new chapters suggests declaring methods in @js.native traits as abstract without = js.native to prevent compilation errors, and correcting the sbt output paths from scala-3.x to scala-3 to match standard Scala 3 builds.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.


@js.native
trait Connection extends js.Object:
def query(sql: String): js.Array[js.Any] = js.native

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

In Scala.js, members of a @js.native trait must be abstract. Defining a method with = js.native inside a native trait is redundant and can cause compilation errors in some Scala.js versions. It should be declared without a body.

Suggested change
def query(sql: String): js.Array[js.Any] = js.native
def query(sql: String): js.Array[js.Any]

Comment thread docs/book/ch13-00-vite.md
to see. (Uni's own JS builds use exactly this setting.)

`sbt app/fastLinkJS` then produces a folder of ES modules under
`target/scala-3.x/app-fastopt/`, with `main.js` as the entry. The

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

In sbt, the default output directory for Scala 3 projects is scala-3 rather than scala-3.x. Updating this path to target/scala-3/app-fastopt/ makes the documentation accurate and copy-pasteable for standard Scala 3 builds.

Comment thread docs/book/ch13-00-vite.md
import './style.css'

// Start the Scala.js application (the fastLinkJS output entry module)
import('./target/scala-3.x/app-fastopt/main.js')

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

medium

Update the dynamic import path to use scala-3 instead of scala-3.x to match the actual directory structure generated by sbt for Scala 3.

Suggested change
import('./target/scala-3.x/app-fastopt/main.js')
import('./target/scala-3/app-fastopt/main.js')

@xerial xerial merged commit 6670942 into main Jun 20, 2026
13 checks passed
@xerial xerial deleted the docs/book-npm-vite branch June 20, 2026 08:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

doc Improvements or additions to documentation

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant