Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

How to use this in the browser? #278

Answered by james-pre
RenaKunisaki asked this question in Q&A
Discussion options

It seems like this is supposed to be possible, but I can't find any examples or info?

You must be logged in to vote

Hey @RenaKunisaki, <script src="..."> is for when you are using library bundles and the like. Assuming that's the route you want to take, you'd probably want to bundle your app.

For your specific use-case you may want to try something like Vite, which would allow you to do <script src="main.ts" type="module"> and move on to the important stuff.

When Vite doesn't fit the use case, my go-to bundler is esbuild. Many others like Webpack and Rollup also work.

Bundling like this is extremely common, so you can easily find plenty of documentation and examples online.

Replies: 1 comment 4 replies

Comment options

Hey @RenaKunisaki,

How you use ZenFS depends heavily on your use case.

If you are just looking to get something working without setting up tooling, I recommend using an import map with esm.sh to quickly be able to import just like in the examples.

You must be logged in to vote
4 replies
Comment options

I'm making an app for editing files inside a proprietary archive format. So I need to let the user open a file, unpack it, make changes, repackage, and download it. Is there really no way to achieve this without depending on an external service?

Comment options

You can by using tooling. After you npm install @zenfs/core, you should be able to use it normally. For distribution there are many different ways to handle that. For desktops apps there is things like Electron and Tauri. For web apps you could run a server, use GitHub pages, or even deploy using cloud provider. There are likely quite a few resources available online for how to set up various build systems and deployments.

Comment options

I have a basic HTTP server. I just need to be able to write <script src="something"> and have zenfs available to my web app. Trying to just do that leads to all kinds of issues with the various libraries wanting to reference scripts by package name instead of filename, require instead of import, etc. I can't tell if I'm missing something obvious or if it's actually this difficult to use a Node package this way?

Comment options

Hey @RenaKunisaki, <script src="..."> is for when you are using library bundles and the like. Assuming that's the route you want to take, you'd probably want to bundle your app.

For your specific use-case you may want to try something like Vite, which would allow you to do <script src="main.ts" type="module"> and move on to the important stuff.

When Vite doesn't fit the use case, my go-to bundler is esbuild. Many others like Webpack and Rollup also work.

Bundling like this is extremely common, so you can easily find plenty of documentation and examples online.

Answer selected by RenaKunisaki
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Category
Q&A
Labels
None yet

AltStyle によって変換されたページ (->オリジナル) /