;
};
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 update @getpara/react-sdk ``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.
```bash theme={null}
npm i @sveltejs/kit
```
Then you'll need to add the appropriate preprocessing and adapter dependencies to the project's `svelte.config.ts` file.
```bash theme={null}
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.
```javascript vite.config.js theme={null}
import { sveltekit } from "@sveltejs/kit/vite";
import { defineConfig } from "vite";
export default defineConfig({
plugins: [sveltekit()],
});
```
```javascript svelte.config.js theme={null}
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:
### 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](https://join.slack.com/t/para-community/shared_invite/zt-304keeulc-Oqs4eusCUAJEpE9DBwAqrg) for
assistance. To help us resolve your issue quickly, please include the following information in your request:
1
A detailed description of the problem you're encountering.
2
Any relevant error messages or logs.
3
Steps to reproduce the issue.
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.
