The Remix setup is largely the same as the React integration guide, except it goes further into how to add to the Remix framework’s app root component.


npm install


The <Partytown/> component is imported from the submodule. The config properties are JSX props.

The following is an example of including the <Partytown/> component in the app’s root component. Notice the <Partytown/> component is in the <head> and before the <Meta/> component. The example below is setting the forward config for Google Tag Manager.

import { Partytown } from '';
import { Links, Meta, Outlet } from '@remix-run/react';

export default function App() {
  return (
    <html lang="en">
        <meta charSet="utf-8" />
        <meta name="viewport" content="width=device-width,initial-scale=1" />
        <Partytown debug={true} forward={['dataLayer.push']} />
        <Meta />
        <Links />

Partytown Script

Add the type="text/partytown" prop for each script that should run from a web worker. The example below is using the React specific way of inlining a script with dangerouslySetInnerHTML.

<Partytown debug={true} forward={['dataLayer.push']} />
    __html: '// inlined third-party script',

Copy Library Files

Copy library files to public/~partytown. How the files are copied or served from your site is up to each site’s setup. A partytown copylib CLI copy task has been provided for convenience which helps copy the Partytown library files to the public directory. Below is an example of creating a “partytown” NPM script which could run before the build:

"scripts": {
  "build": "npm run partytown && cross-env NODE_ENV=production remix build",
  "partytown": "partytown copylib public/~partytown"
Made with ❤️ by

© 2024, Inc.

Introducing Visual Copilot.

100% free. Supports all popular frameworks.

Try Visual Copilot