# astrimid - Trying to use runframe package: V... Channel: #support Source: https://discord.com/channels/1233487248129921135/1531427824915710104 Started: 2026-07-27T22:27:26.452000+00:00 Last activity: 2026-07-28T13:50:58.632000+00:00 ## Seve — 2026-07-27T22:38:53.477000+00:00 yea i think that is harmless ## astrimid — 2026-07-27T22:42:13.263000+00:00 there's no way to automate runframe updates if they don't list dependencies. I see a lot of things listed in devDependencies that should really be runtime dependencies. If you have versioning conflicts with downstream packages, I don't see how it wouldn't be a problem with runframe if you don't list dependencies at all ## Seve — 2026-07-27T22:43:11.828000+00:00 "tscircuit" as a package provides a ton of transient dependencies, it isn't always simple ## astrimid — 2026-07-27T22:45:48.693000+00:00 so it's a polyrepo but a single workspace, seems to be worst of both worlds ## Seve — 2026-07-27T22:46:19.185000+00:00 this is a very large codebase ## Seve — 2026-07-27T22:46:25.973000+00:00 (there are 500 repos) ## astrimid — 2026-07-27T22:46:32.762000+00:00 so, can I install tscircuit/tscircuit and get runframe depdendencies for free? ## Seve — 2026-07-27T22:46:44.350000+00:00 probably! ## astrimid — 2026-07-27T22:47:00.898000+00:00 [attachment] Attachment: image.png — https://community.tscircuit.com/media/1531432752748957887 ## astrimid — 2026-07-27T22:47:32.819000+00:00 here's dependency tree according to npm ## Seve — 2026-07-27T22:48:03.794000+00:00 yea that's an old version from our docs ## Seve — 2026-07-27T22:48:16.285000+00:00 latest version here: https://docs.tscircuit.com/contributing/package-dependencies-and-auto-updates ## Seve — 2026-07-27T22:48:22.964000+00:00 those are the "major" dependencies ## Seve — 2026-07-27T22:48:51.815000+00:00 but the autorouter alone (which is excluded from that diagram because it has a special release team) has almost 100 dependencies itself haha but those are absolutely the major ones ## astrimid — 2026-07-27T22:51:53.152000+00:00 no, some packages don't have dependents at all. Attachment: image.png — https://community.tscircuit.com/media/1531433978178044056 ## astrimid — 2026-07-27T22:53:48.047000+00:00 something is seriously wrong with package.json/build pipeline. it means those are not real packages, just code that happens to be on npm - monorepo code that published to npm as a side effect. you might as well not publish to npm at all ## Seve — 2026-07-27T22:55:01.920000+00:00 the packaging is not perfect but it is usab.e. I have no idea what the "dependent" packages are there, since they are unaffiliated users of the library (presumably) ## astrimid — 2026-07-27T22:56:53.895000+00:00 npm tracks all package that lists the package in question in "dependencies" as a dependent. if you don't have pcv-vewier in depedendencies of any of your repos, that means you have a build pipeline that doesn't use npm ## astrimid — 2026-07-27T23:03:40.251000+00:00 for example, why `footprinter` is a `devDependency` of `tscircuit`? Does it not run in runtime? ## astrimid — 2026-07-27T23:04:52.145000+00:00 [attachment] Attachment: image.png — https://community.tscircuit.com/media/1531437245586735204 ## astrimid — 2026-07-27T23:05:32.805000+00:00 why exactly all dependencies are devDependencies? I don't get it ## astrimid — 2026-07-27T23:07:11.067000+00:00 So it's a deliberate design choice: https://github.com/tscircuit/lint/issues/4 ## astrimid — 2026-07-27T23:13:23.590000+00:00 this is expected behavior when you use 0.0.x packages. npm duplicates 0.0.x dependencies because semVer standard treats every 0.0.x version as containing breaking changes. had you used compatible versions, such as "1.0.*", npm would've always installed the latest version of the package, which is what you probably want Attachment: 398501595-fc162836-54dd-4105-83f1-ab6ae2f4e887.png — https://community.tscircuit.com/media/1531439390671376484 ## Seve — 2026-07-27T23:14:22.034000+00:00 ah that's interesting, i didn't know npm had that special 0.0.x behavior ## Seve — 2026-07-27T23:14:28.312000+00:00 we should increment to 0.1.x for everything ## Seve — 2026-07-27T23:14:50.038000+00:00 if we have to do 1.x.x that's OK but not my preference hahaha ## astrimid — 2026-07-27T23:17:07.289000+00:00 this is actually the whole reason why npm ecosystem works. if there's incompatibility, the package is silently duplicated and there's no problem Attachment: image.png — https://community.tscircuit.com/media/1531440329012809749 ## astrimid — 2026-07-27T23:18:29.586000+00:00 if the versions are deemed compatible by the semver convention, npm deduplicates packages and installes the minimum compatible combination ## astrimid — 2026-07-27T23:19:25.137000+00:00 if you want to force package version to be compatible, you can put `"overrides"` in `package.json` root and it would use that single version for all dependencies ## Seve — 2026-07-27T23:20:06.789000+00:00 i think for most users, they only need to use "tscircuit" ## Seve — 2026-07-27T23:20:27.124000+00:00 so you're basically talking about internal ecosystem stuff for the most part, even for startups building on tscircuit, they can just use "tscircuit" ## Seve — 2026-07-27T23:20:45.005000+00:00 because there is special bundling etc. it really isn't possible to use the dependency system as is ## Seve — 2026-07-27T23:21:26.407000+00:00 you could look at tsup's bundling behavior if this sounds interesting, but i think it's much easier to just have the ecosystem consume "tscircuit" because we can provide strong contracts for that usage ## astrimid — 2026-07-27T23:25:56.508000+00:00 ``` { "overrides": { "tscircuit": "0.0.2030", "@tscircuit/runframe": "0.0.2128" } } ``` ## astrimid — 2026-07-27T23:26:47.030000+00:00 what do you mean by `tscircuit`? how do I install tscircuit package with all the dependencies so that I could embed runframe? ## astrimid — 2026-07-27T23:27:01.456000+00:00 are you suggesting forking or what? ## Seve — 2026-07-27T23:27:47.155000+00:00 you should be able to do `bun add -D tscircuit @tscircuit/runframe` and you'll have all the dependencies you need no? ## Seve — 2026-07-27T23:27:58.675000+00:00 i don't think you need overrides ## astrimid — 2026-07-27T23:28:50.051000+00:00 that's exactly what I did: Attachment: image.png — https://community.tscircuit.com/media/1531443276614209686 ## astrimid — 2026-07-27T23:29:18.343000+00:00 ``` "scripts": { "dev": "bunx vite", "build": "bunx vite build", "preview": "bunx vite preview" }, ``` ## astrimid — 2026-07-27T23:30:20.113000+00:00 ``` import { RunFrame } from "@tscircuit/runframe" ...
``` ## astrimid — 2026-07-27T23:30:56.176000+00:00 is ther any example project I could look up ? ## Seve — 2026-07-27T23:32:04.614000+00:00 i think that's a bug ## astrimid — 2026-07-27T23:32:12.265000+00:00 afaik, npm doesn't have any way to install transitive devdependencies ## Seve — 2026-07-27T23:32:16.972000+00:00 circuit-json-to-pnp-csv should be built in ## Seve — 2026-07-27T23:32:27.743000+00:00 there are no transitive dev deps, dev deps are BUNDLED ## Seve — 2026-07-27T23:32:36.353000+00:00 so "marked" is, for some reason, not being bundled ## Seve — 2026-07-27T23:33:08.163000+00:00 which means it needs to either be provided as a transitive dependency by tscircuit or as a bundled dependency for runframe ## Seve — 2026-07-27T23:33:21.480000+00:00 CC <@452450065941004289> & <@809856037376491570> do you guys know what's up with marked? ## astrimid — 2026-07-27T23:33:25.387000+00:00 maybe something with bun version? ## Seve — 2026-07-27T23:33:40.579000+00:00 circuit-json-to-pnp-csv should be inside the main tscircuit/tscircuit package.json so that is a legit bug ## astrimid — 2026-07-27T23:33:46.189000+00:00 ``` bun --version 1.3.14 ``` ## astrimid — 2026-07-27T23:34:28.954000+00:00 I'm importing via `import { RunFrame } from "@tscircuit/runframe"` is there a way to import from `@tscircuit/core` or someting ## Rishabh — 2026-07-27T23:34:52.706000+00:00 No idea ## Seve — 2026-07-27T23:35:24.996000+00:00 maybe it's a big dep so deliberately excluded, but honestly astramid i would just work around those with a temporary install of the two missing deps ## Seve — 2026-07-27T23:35:29.068000+00:00 we'll patch the issue tho ## Seve — 2026-07-27T23:35:40.360000+00:00 just need to figure out why chestertons fence is there on marked ## astrimid — 2026-07-27T23:36:10.185000+00:00 it's not just two, there are hundreds of deps missing. could you provide any starter bun/vite project with runframe? ## astrimid — 2026-07-27T23:36:25.276000+00:00 so that we could isolate whether it's environment issue or a bug ## Rishabh — 2026-07-27T23:37:00.582000+00:00 Let me try to see if I can create a runframe project ## astrimid — 2026-07-27T23:40:06.927000+00:00 maybe it's a vite issue? ``` ✘ [ERROR] Failed to resolve entry for package "@tscircuit/core". The package may have incorrect main/module/exports specified in its package.json. [plugin vite:dep-pre-bundle] node_modules/vite/dist/node/chunks/dep-BK3b2jBa.js:46638:18: 46638 │ const err = new Error( ``` ## astrimid — 2026-07-27T23:42:08.394000+00:00 LLM suggests that `yalc add @tscircuit/runframe` is the only way to use tscircuit ## Seve — 2026-07-27T23:42:39.215000+00:00 fwiw you can always use the iframe method of running runframe ## Seve — 2026-07-27T23:42:55.033000+00:00 but i think Rishabh is looking into this now so we should know shortly ## astrimid — 2026-07-27T23:44:57.031000+00:00 you mean embedding from tscircuit.com? ## Rishabh — 2026-07-27T23:45:30.909000+00:00 https://docs.tscircuit.com/guides/running-tscircuit/running-tscircuit-inside-an-iframe ## astrimid — 2026-07-27T23:49:47.085000+00:00 Could be vite bundler conflict? ``` ✘ [ERROR] Missing "./iframe" specifier in "@tscircuit/runframe" package [plugin vite:dep-scan] node_modules/vite/dist/node/chunks/dep-BK3b2jBa.js:46042:28: ... This error came from the "onResolve" callback registered here: node_modules/vite/dist/node/chunks/dep-BK3b2jBa.js:49789:12: 49789 │ build.onResolve( ╵ ~~~~~~~~~ The plugin "vite:dep-scan" was triggered by this import src/App.tsx:1:35: 1 │ import { RunFrameWithIframe } from "@tscircuit/runframe/iframe" ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ ``` ## astrimid — 2026-07-27T23:50:07.374000+00:00 do you use bun or vite? ## Rishabh — 2026-07-27T23:59:40.472000+00:00 I was able to run a small runframe project with only `runframe` and `tscircuit` just make sure you are using the `standalone` bundle from runframe. This is the zip generated from ai if you wanna take a look Attachment: tscircuit-runframe-capacitor-demo.zip — https://cdn.discordapp.com/attachments/1531427824915710104/1531451037825630368/tscircuit-runframe-capacitor-demo.zip?ex=6a69eb2c&is=6a6899ac&hm=b09b68e4113d214e426bd9fcb979e8850c7a321ea3a1158dbb798bcb13dd6da6& ## astrimid — 2026-07-28T00:27:57.314000+00:00 can't see attachments ## astrimid — 2026-07-28T00:28:30.714000+00:00 what is standalone bundle? ## Rishabh — 2026-07-28T00:37:05.914000+00:00 You can import the standlone by `@tscircuit/runframe/standalone` ## Rishabh — 2026-07-28T00:40:10.171000+00:00 https://drive.google.com/file/d/171IoymPBymTcwrSeB5eLCHr2vaZi0p4w/view?usp=drive_link ## astrimid — 2026-07-28T00:53:49.081000+00:00 calculate-cell-boundaries uses react 18 in dependencies: https://github.com/tscircuit/calculate-cell-boundaries/blob/a44e1edc42fec857399421f60973a05923a1d969/package.json#L19 while it should really be peer dependencies ^17.0.0 || ^18.0.0 || ^19.0.0 like radix ## astrimid — 2026-07-28T00:55:54.638000+00:00 similarly, jscad-electronics uses ^19, so it's marked as incompatible with calculate-cell-boundaries: https://github.com/tscircuit/jscad-electronics/blob/3644ce6ab469fc83b27a090b1529b0a8120472c2/package.json#L54 ## astrimid — 2026-07-28T01:03:38.210000+00:00 similar issue: tscircuit-viewer (requires ^18.2.0) react-reconciler@0.32.0 (requires ^19.1.0) use-mouse-matrix-transform@1.3.5 (requires ^18.2.0) tscircuit@0.0.2166 (requires ^19.1.0) ## astrimid — 2026-07-28T01:04:04.286000+00:00 so even for such a basic dependency as react, version dependency is inconsistent ## astrimid — 2026-07-28T01:04:41.672000+00:00 I don't know whether it means duplicate react versions or whether react is bundled or is it really a peer dependency ## Seve — 2026-07-28T01:11:39.226000+00:00 hmm ## Seve — 2026-07-28T01:11:46.608000+00:00 calculate-cell-boundaries should only be using dev deps ## Seve — 2026-07-28T01:12:19.631000+00:00 usually we try to use "*" for peer deps ## astrimid — 2026-07-28T01:34:42.053000+00:00 more errors: ``` ✘ [ERROR] No matching export in "node_modules/@tscircuit/checks/dist/index.js" for import "dedupePcbDrcErrors" node_modules/@tscircuit/core/dist/index.js:15106:2: 15106 │ dedupePcbDrcErrors, ╵ ~~~~~~~~~~~~~~~~~~ ✘ [ERROR] No matching export in "node_modules/@tscircuit/circuit-json-util/dist/index.js" for import "getSchematicElementBounds" node_modules/@tscircuit/core/dist/index.js:34618:2: 34618 │ getSchematicElementBounds ╵ ~~~~~~~~~~~~~~~~~~~~~~~~~ 1467 | let { file, line, column } = e.location; 1468 | let pluginText = e.pluginName ? `[plugin: ${e.pluginName}] ` : ""; 1469 | return ` 1470 | ${file}:${line}:${column}: ERROR: ${pluginText}${e.text}`; 1471 | }).join(""); 1472 | let error = new Error(text); ^ error: Build failed with 2 errors: node_modules/@tscircuit/core/dist/index.js:15106:2: ERROR: No matching export in "node_modules/@tscircuit/checks/dist/index.js" for import "dedupePcbDrcErrors" node_modules/@tscircuit/core/dist/index.js:34618:2: ERROR: No matching export in "node_modules/@tscircuit/circuit-json-util/dist/index.js" for import "getSchematicElementBounds" ``` ## astrimid — 2026-07-28T01:36:10.340000+00:00 apparently, because core doesn't specify versions it depends on, so bun install succeeeds, but it runtime fails ## astrimid — 2026-07-28T01:39:31.648000+00:00 ├─ @tscircuit/3d-viewer@0.0.15 (requires ^18.3.1) ├─ @tscircuit/schematic-autolayout@0.0.5 (requires ^18.2.0) ├─ calculate-cell-boundaries@0.0.13 (requires ^18.3.1) so there are 3 tscircuit package that require react 18. Maybe I can' update them ## astrimid — 2026-07-28T01:42:20.421000+00:00 updating those 2 helped, so that leaves only one, ├─ calculate-cell-boundaries@0.0.13 (requires ^18.3.1) ## Seve — 2026-07-28T01:42:48.034000+00:00 <@809856037376491570> is this a calculate-cell-boundaries issue? ## Rishabh — 2026-07-28T01:50:15.097000+00:00 i don't know, the example repro by AI is using the runframe standalone bundle without having any deps issue ## astrimid — 2026-07-28T01:50:18.095000+00:00 success. `overrides` helped to fix the duplicate react 18/19 issue. I had to manually specify all the dependencies and tweak versions. Attachment: image.png — https://community.tscircuit.com/media/1531478877988327474 Attachment: package.json — https://cdn.discordapp.com/attachments/1531427824915710104/1531478878260953198/package.json?ex=6a6a051a&is=6a68b39a&hm=08ae8226559a852f1001ab21438971d158b4fc9770b0e9ab47bf32e12a93a776& ## astrimid — 2026-07-28T01:50:33.547000+00:00 ^ this is not using standalone ## Rishabh — 2026-07-28T01:50:42.306000+00:00 Ok ## astrimid — 2026-07-28T01:51:15.767000+00:00 now I have a strange bug, the schematic view is moving down ## astrimid — 2026-07-28T01:52:45.360000+00:00 [attachment] Attachment: App.tsx — https://cdn.discordapp.com/attachments/1531427824915710104/1531479495876546652/App.tsx?ex=6a6a05ad&is=6a68b42d&hm=e2de6f2fed56600814d3ca33cf3be7f7ba8520ae16dfeed58193b504d83fb341& ## astrimid — 2026-07-28T01:54:40.131000+00:00 maybe the issue of using 100vh ## astrimid — 2026-07-28T01:56:10.534000+00:00 it's not moving per see, it appears the height is growing uncontrollably ## astrimid — 2026-07-28T02:03:37.898000+00:00 the height of svg seems to be incrementing 20 times per second Attachment: image.png — https://community.tscircuit.com/media/1531482232911302726 ## astrimid — 2026-07-28T02:07:12.278000+00:00 [attachment] Attachment: image.png — https://community.tscircuit.com/media/1531483131897446541 ## astrimid — 2026-07-28T02:17:55.198000+00:00 ``` const svgDiv = useMemo( () => (
{ if (editModeEnabled && isInteractionEnabled && !showSpiceOverlay) { handleComponentTouchStartRef.current(e) } }} // biome-ignore lint/security/noDangerouslySetInnerHtml: dangerouslySetInnerHTML={{ __html: svgString }} /> ), [ svgString, isInteractionEnabled, clickToInteractEnabled, editModeEnabled, showSpiceOverlay, ], ) ``` ## astrimid — 2026-07-28T03:02:47.132000+00:00 This is a workaround: ``` containerStyle={{ width: "100vw", height: "100vh", backgroundColor: "#f8f9fa", }} ``` Attachment: image.png — https://community.tscircuit.com/media/1531497119238586480 ## astrimid — 2026-07-28T13:50:58.632000+00:00 I've summariesed the `devDependencies` issue in a separate thread. The schematic-viewer issue and react conflict are separate issues. https://community.tscircuit.com/thread/1531639565788647506