feat(js): Add vite bundler build issue to troubleshooting (#5616)

Co-authored-by: Katie Byers <[email protected]>
Co-authored-by: Isabel <[email protected]>

Author: 3 people

src/platforms/javascript/common/troubleshooting/index.mdx

@@ -427,3 +427,29 @@ Remember to pass in `true` as the second parameter to `addEventListener()`. With
 Starting with version 7.0.0, the Sentry JavaScript SDK uses ES6 syntax, along with a few other ES6+ language features, like object spread. If you are down-compiling your code in order to target older browsers that don't support such syntax, you'll need to include the Sentry SDK in that process.
 
 <PlatformContent includePath="troubleshooting/older-browser-support" />
+
+## Build Errors With Vite
+
+If you're using the [Vite Bundler](https://vitejs.dev/) and a Sentry NPM package, and you see the following error:
+
+```
+Error: Could not resolve './{}.js' from node_modules/@sentry/utils/esm/index.js
+```
+
+This might be because the [`define`](https://vitejs.dev/config/shared-options.html#define) option in your Vite config is string-replacing some variable used by the Sentry SDK, like `global`, which causes build errors. Vite recommends using `define` for CONSTANTS only, and not putting `process` or `global` into the options. To fix this build error, remove or update your `define` option, as shown below:
+
+```diff
+diff --git a/vite.config.ts b/vite.config.ts
+index 8614337..005915c 100644
+--- a/vite.config.ts
++++ b/vite.config.ts
+@@ -6,8 +6,5 @@ export default defineConfig({
+   build: {
+     sourcemap: true
+   },
+-  define: {
+-    global: {}
+-  },
+   plugins: [react()]
+ })
+```