Ray Kholodovsky - I tried to use the exact exam...
I tried to use the exact examples at the top of each:
https://www.npmjs.com/package/@tscircuit/circuit-preview
https://github.com/tscircuit/runframe
in a blank nodejs project and they do not work. Claude is under the impression that there are too many external deps that are not bundled with runframe. in any case, both things appear broken today without "some advanced knowledge of how to fix / make work" that is not in the readme.
GitHub
GitHub - tscircuit/runframe: Runs tscircuit code inside a webworker...
Runs tscircuit code inside a webworker, view PCBs, schematics and 3D previews - tscircuit/runframe
23 Replies
for reference, I was just trying to mock up a basic circuit render like how it's done in the docs, even if the "how to docusaurus with tscircuit" example isn't ready yet.
Yea RunFrame requires installing a bunch of stuff
this is actually intentional but we are lazy about documenting it- the reason it is intentional is related to how RunFrame has a lot of different ways it is able to be run
Ok, since my goal here is to just use CircuitPreview for basic docs examples can I reiterate the request to “the basic CircuitPreview example should work in a empty project, please show me how/ fix it”?
CircuitPreview from the docs? This uses our build/svg server, I think what you're asking for is build-time server compilation for circuits for custom docs sites which is actually a pretty tall ask
RunFrame compiles in-browser which is simple, but having build-time compilation of circuits is non-trivial
our docs use a build server that has access to public circuit modules, it can't access private modules by design
Should this work standalone in an empty project or no?
that is for browser-side building, and actually i'm not sure that that module is maintained/was meant to be used externally
although it's a good idea to make it work externally
that module was developed for our ChatGPT integration
to be fair, the README says this
Right, and unless there’s a hidden difference, your docs use CircuitPreview but as I seem to have discovered there are a bunch of hidden internal reps I’m unaware of.
the docs do not use this CircuitPreview module
the docs define the CircuitPreview component themselves, and use the svg build server
Ok, that is good to know.
yes sorry about the confusion- the chatgpt integration was challenging and we made several poorly named modules
The same name but different was probably a good chunk of why I was confused.
The lack of docs on how to use runframe in a blank slate is also part of it.
Yea needs to be made!!! Agree
I don’t think this is what I’m asking for at least not right now? But I think you’re onto how I imagine our final docs site being.
For displaying a super simple circuit in someone else’s browser, my options are:
A) build it and static display the circuit json result
B) just tsx + deps and the end user’s browser renders it.
C) something like B that involves the building in some cloud, idk?
Right now I’m just trying to achieve B. I was under the impression that’s what CircuitPreview or runframe could do.
Yes B should work!!
Ok so again to my point, this doesn’t work for me, prob because as you said it’s outdated
And if I want to do it in runframe I will need to know what deps/ other unique things to do to make it work in an empty project.
And you have made the issue so I guess we are in agreement/ don’t need to talk in circles
Yep, we will fix
You can actually do it wo dependencies
have you tried this approach? https://docs.tscircuit.com/guides/running-tscircuit/running-tscircuit-inside-an-iframe#react-iframe-wrapper-for-tscircuit
Running tscircuit inside an iframe | tscircuit docs
tscircuit can be evaluated inside an iframe. This makes it easy to embed snippets on a webpage without complex build systems.
i know another company was using this at one point
I was operating under the belief that using an iframe was inherently less efficient/ performant/ reliable vs a "native" solution so I did not try it.
The only downside in this case is you will always use the latest tscircuit version