Ipfs Vite Svelte Kit

Overview

This document provides a guide for installing and running IPFS and OrbitDB with SvelteKit, including steps to reproduce the setup. It also mentions the need to install certain dependencies and provides instructions for building the required modules for the browser.

Features

• Integration of IPFS and OrbitDB with SvelteKit
• Use of esbuild for building IPFS-core for the browser
• Installation of necessary dependencies like ipfs-core, process, and util
• Configuration of SvelteKit to work with IPFS and OrbitDB
• DAG building using ipfs.dag.put()

Installation

1. Clone the SvelteKit directory.
2. Install SvelteKit using the command npm install.
3. Install ipfs-core by running npm i ipfs-core.
4. Install process and util dependencies, which are not available in the browser, using the command npm i process util.
5. Create a file named src/node-globals.js and save the required globals in it.
6. Install esbuild as a development dependency using npm i -D esbuild.
7. Add a script to the package.json file to run the esbuild build process.
8. Run the esbuild script using npm run esbuild.
9. Import IPFS in your app by adding the following code inside the onMount hook in Svelte: import IPFS from 'src/modules/ipfs-core/ipfs-core.js'.
10. Run the app using the command npm run dev.
11. Build the app using npm run build.
12. Install the adapter for static sites using npm i @sveltejs/adapter-static.
13. Add the following lines to your svelte.config.js file:

import adapter from '@sveltejs/adapter-static';
export default {
  ...
  kit: {
    ...
    adapter: adapter({ fallback: 'index.html' }),
    ...
  },
  ...
};

14. Build the app again using npm run build.
15. Preview the built app using npx serve __sapper__/build.
16. Open the app in your localhost.

Note: In development mode, SvelteKit replaces globalThis.process.env.NODE_ENV with globalThis."development", which can cause issues. To prevent this, replace globalThis.process.env.NODE_ENV accordingly during the esbuild process.

Summary

This guide provides step-by-step instructions for installing and running IPFS and OrbitDB with SvelteKit. It covers the installation of dependencies, building IPFS-core for the browser, and configuring SvelteKit to work with IPFS and OrbitDB. The guide also includes instructions for running and building the app, as well as a note about preventing issues during development mode.