Vite Plugins for Webxdc

Collection of Vite plugins and utilities for webxdc.

Features

• 📱 Integrated webxdc.js mini-emulator to test your WebXDC right on the browser while developing.

• 🐞 Integrated Eruda support to debug inside Delta Chat when building with NODE_ENV=debug.

• 📦 Automatically generate your .xdc file.

• 🦕 Support legacy/old browsers.

Getting Started

Scaffolding your first webxdc project:

npm create @webxdc/vite-plugins@latest

Then update your Vite configuration as needed. See below for example Vite configurations.

Example configurations

Example vite.config.js files

Use recommended configuration

Use webxdcViteConfig() for a quick and easy default configuration.

// vite.config.ts

import { webxdcViteConfig } from "@webxdc/vite-plugins";
import { defineConfig } from "vite";

export default defineConfig(webxdcViteConfig());

Use plugins individually

Use the individual plugins for more control over the build.

// vite.config.ts

import {
  buildXDC,
  eruda,
  mockWebxdc,
  //  legacy, // might cause problems in existing projects
} from "@webxdc/vite-plugins";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [buildXDC(), eruda(), mockWebxdc()],
});

For a full example check the example folder.

Troubleshooting

if you get this error when using vite:

✘ [ERROR] Failed to resolve "@webxdc/vite-plugins". This package is ESM only but it was tried to load by `require`.

to fix it you need to set in your package.json:

{
  ...
  "type": "module",
  ...
}