---
title: "Segment · Nuxt Scripts"
meta:
  description: "Nuxt Scripts lets you load third-party scripts with better performance, privacy, security and DX. It includes many popular third-parties out of the box."
  "og:description": "Nuxt Scripts lets you load third-party scripts with better performance, privacy, security and DX. It includes many popular third-parties out of the box."
  "og:title": "Segment · Nuxt Scripts"
---

```

Nuxt Scripts on GitHub

**

**Tracking**# **Segment**[Copy for LLMs](https://scripts.nuxt.com/scripts/v0/tracking/segment.md) [**~~Segment~~**](https://segment.com/) lets you collect, clean, and control your customer data. Segment helps you to understand your customers and personalize their experience. Nuxt Scripts provides a registry script composable `useScriptSegment` to easily integrate Segment in your Nuxt app. ### Nuxt Config Setup The simplest way to load Segment globally in your Nuxt App is to use Nuxt config. Alternatively you can directly use the **~~useScriptSegment~~** composable. If you don't plan to send custom events you can use the [**~~Environment overrides~~**](https://nuxt.com/docs/getting-started/configuration#environment-overrides) to disable the script in development.```
export default defineNuxtConfig({
  scripts: {
    registry: {
      segment: {
        writeKey: 'YOUR_WRITE_KEY'
      }
    }
  }
})
``````
export default defineNuxtConfig({
  $production: {
    scripts: {
      registry: {
        segment: {
          writeKey: 'YOUR_WRITE_KEY'
        }
      }
    }
  }
})
```#### With Environment Variables If you prefer to configure your id using environment variables.nuxt.config.ts```
export default defineNuxtConfig({
  scripts: {
    registry: {
      segment: true,
    }
  },
  // you need to provide a runtime config to access the environment variables
  runtimeConfig: {
    public: {
      scripts: {
        segment: {
          writeKey: '' // NUXT_PUBLIC_SCRIPTS_SEGMENT_WRITE_KEY
        }
      },
    },
  },
})
```.env```
NUXT_PUBLIC_SCRIPTS_SEGMENT_WRITE_KEY=<YOUR_WRITE_KEY>
```## useScriptSegment The `useScriptSegment` composable lets you have fine-grain control over when and how Segment is loaded on your site.```
const { proxy } = useScriptSegment({
  id: 'YOUR_ID'
})
// example
proxy.track('event', {
  foo: 'bar'
})
``` Please follow the [**~~Registry Scripts~~**](https://scripts.nuxt.com/docs/guides/registry-scripts) guide to learn more about advanced usage. ### SegmentApi```
interface SegmentApi {
  track: (event: string, properties?: Record<string, any>) => void
  page: (name?: string, properties?: Record<string, any>) => void
  identify: (userId: string, traits?: Record<string, any>, options?: Record<string, any>) => void
  group: (groupId: string, traits?: Record<string, any>, options?: Record<string, any>) => void
  alias: (userId: string, previousId: string, options?: Record<string, any>) => void
  reset: () => void
}
```### Config Schema You must provide the options when setting up the script for the first time.```
export const SegmentOptions = object({
  writeKey: string(),
  analyticsKey: optional(string()),
})
```## Example Using Segment only in production while using `analytics` to send a conversion event.```
<script setup lang="ts">
const { proxy } = useScriptSegment()

// noop in development, ssr
// just works in production, client
function sendConversion() {
  proxy.track('conversion', {
    value: 1,
    currency: 'USD'
  })
}
</script>

<template>
  <div>
    <button @click="sendConversion">
      Send Conversion
    </button>
  </div>
</template>
```[~~Edit this page~~](https://github.com/nuxt/scripts/edit/0.x/docs/content/scripts/v0/tracking/segment.md) [~~Markdown For LLMs~~](https://scripts.nuxt.com/scripts/v0/tracking/segment.md) [**Reddit Pixel** Use Reddit Pixel in your Nuxt app.](https://scripts.nuxt.com/scripts/v0/tracking/reddit-pixel) [**Snapchat Pixel** Use Snapchat Pixel in your Nuxt app.](https://scripts.nuxt.com/scripts/v0/tracking/snapchat-pixel)**On this page **- [Nuxt Config Setup](#nuxt-config-setup) - [useScriptSegment](#usescriptsegment) - [Example](#example)