Skip to main content
Using an LLM (ChatGPT, Claude) or Coding Assistant (Cursor, Github Copilot)? Here are a few tips:
  1. Include the for the most up-to-date help
  2. Check out the for an interactive LLM using Para Examples Hub

​
General Troubleshooting Steps

Before diving into specific issues, try these general troubleshooting steps:
bash rm -rf node_modules npm cache clean --force
bash npm install
bash npm run build
Svelte applications require configuring some additional polyfills for svelte and react preprocessing. The following example should cover these requirements.

​
Adding Svelte and React + Vite Preprocessing

First, ensure svelteKit is installed and configured correctly within the project’s vite.config.ts file. 
npm i @sveltejs/kit
Then you’ll need to add the appropriate preprocessing and adapter dependencies to the project’s svelte.config.ts file. 
npm i @sveltejs/vite-plugin-svelte @sveltejs/adapter-auto @svelte-preprocess @svelte-preprocess-react
Last, configure the vite.config.js and svelte.config.js project files to add preprocessing. See the below code files for reference examples. 
import { sveltekit } from "@sveltejs/kit/vite";
import { defineConfig } from "vite";

export default defineConfig({
  plugins: [sveltekit()],
});

import adapter from "@sveltejs/adapter-auto";
import { vitePreprocess } from "@sveltejs/vite-plugin-svelte";
import preprocessReact from "svelte-preprocess-react/preprocessReact";

/**
 * This will add autocompletion if you're working with SvelteKit
 *
 * @type {import('@sveltejs/kit').Config}
 */
const config = {
  // Consult https://kit.svelte.dev/docs/integrations#preprocessors
  // for more information about preprocessors
  preprocess: [vitePreprocess(), preprocessReact()],
  kit: {
    // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
    // If your environment is not supported or you settled on a specific environment, switch out the adapter.
    // See https://kit.svelte.dev/docs/adapters for more information about adapters.
    adapter: adapter(),
  },
};

export default config;
For more info, including CommonJS style configs, please see the

​
Example

Explore our example implementation of SvelteKit and Svelte with Vite:

Svelte Example

​
Best Practices

  1. Use the Latest Versions: Always use the latest versions of Svelte, React, and Para SDK to ensure compatibility and access to the latest features.
  2. Error Handling: Implement error boundaries to gracefully handle any runtime errors related to Para integration.
  3. Development vs Production: Use environment-specific configurations to manage different settings for development and production builds. Para provides environment-specific API keys.
By following these troubleshooting steps and best practices, you should be able to resolve most common issues when integrating Para with your React application using Vite.

​
Integration Support

If you’re experiencing issues that aren’t resolved by our troubleshooting resources, please contact our team for assistance. To help us resolve your issue quickly, please include the following information in your request:
  1. 1

    A detailed description of the problem you’re encountering.

  2. 2

    Any relevant error messages or logs.

  3. 3

    Steps to reproduce the issue.

  4. 4

    Details about your system or environment (e.g., device, operating system, software version).

Providing this information will enable our team to address your concerns more efficiently.