Skip to content

[Docs] Script-tag / IIFE usage instructions are incorrect #92

Description

@SamuelAB-VIM

Environment

  • vim-web 1.0.0-alpha.0, IIFE build (dist/vim-web.iife.js) loaded via <script>
  • API: VIM.Core.Webgl.createViewer() (headless, custom UI)
  • Chromium / desktop, devicePixelRatio 1.75
  • Model: 2,547 elements (2,264 with geometry), 12 Revit categories, structural

The current script-tag guidance does not work as written. Observed corrections:

Doc says Reality
<script src="vim-web.umd.js"> file is dist/vim-web.iife.js (no .umd.js)
global VIM global is VIMReact
VIM.React.Webgl.createViewer(...) works under VIMReact.*, but…
(nothing about peers) React and ReactDOM must be present as globals first — the bundle ends }({}, React, ReactDOM) (peers externalized; three is bundled)
(nothing about process) a window.process shim is required or the bundle throws on load

Without the shim, loading the IIFE throws immediately:

ReferenceError: process is not defined
    at requireJsxRuntime (...)

Working snippet (please document something like this):

<script>window.process = window.process || { env: { NODE_ENV: 'production' } };</script>
<script src="https://unpkg.com/react@18.3.1/umd/react.production.min.js"></script>
<script src="https://unpkg.com/react-dom@18.3.1/umd/react-dom.production.min.js"></script>
<script src="https://unpkg.com/vim-web@<version>/dist/vim-web.iife.js"></script>
<script>
  const VIM = VIMReact;                          // global is VIMReact
  const viewer = VIM.Core.Webgl.createViewer();  // headless, no React UI
  document.body.appendChild(viewer.viewport.canvas);
  const vim = await viewer.load({ url: 'model.vim' }).getVim();
  await vim.load();
</script>

Bonus ask. Consider shipping a self-contained IIFE that bundles React (or exposes a UMD
that doesn't require window.process), so <script> consumers don't need shims/peers.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions