How to Detect if a Website Uses Vue.js: 5 Methods

Vue.js is the second most popular JavaScript framework on the web, powering everything from interactive dashboards to full server-rendered applications built with Nuxt.js. Unlike React, which dominates mindshare in the US market, Vue has massive adoption in Asia, Europe, and the open-source community. Alibaba, GitLab, Nintendo, and Adobe all use Vue in production.

But Vue sites do not announce themselves. A well-built Vue application looks like any other modern website in the browser. Whether you are evaluating a competitor’s technology choices, qualifying leads based on their tech stack, auditing for known vulnerabilities, or researching a company before an interview, you need reliable detection methods. This guide covers five approaches, from quick manual checks to fully automated API-based detection.

Why Detect Vue.js on a Website

Knowing whether a site runs Vue.js is useful for several practical reasons:

• Competitive intelligence: Understanding whether competitors chose Vue, React, or Angular reveals engineering priorities. A Vue site signals a team that values simplicity and progressive adoption. A Nuxt.js site means they invested in server-side rendering and SEO—similar trade-offs to Next.js in the React ecosystem.
• Security auditing: Vue.js versions have known CVEs. Detecting an outdated Vue 2 installation on a target site is a concrete security finding. Vue 2 reached end-of-life on December 31, 2023, so any site still running it is no longer receiving security patches.
• Sales prospecting: If you sell developer tools, component libraries, or Vue-specific services, knowing which companies use Vue determines whether your outreach is relevant. This is the same technographic approach used for finding companies that use Stripe.
• Migration planning: Vue 2 to Vue 3 is a significant migration. Before planning the upgrade, you need to verify what is actually running in production—not what the internal wiki says.
• Hiring context: Researching a company’s tech stack before an interview helps you understand what you will be working with and what questions to prepare for.

Method 1 — Browser DevTools Console

The fastest way to check if a website uses Vue.js is through the browser’s DevTools console. Vue leaves several fingerprints in the DOM and in JavaScript globals that you can query directly.

Check for the Vue Global Object

Open Chrome DevTools (press F12 or Cmd+Option+I on macOS), switch to the Console tab, and run these checks:

// Vue 3 global flag (set by Vue itself)
!!window.__VUE__

// Vue 2 global constructor (CDN builds or global registration)
!!window.Vue

// Vue DevTools hook (present on most Vue sites, both v2 and v3)
!!window.__VUE_DEVTOOLS_GLOBAL_HOOK__

// Nuxt.js (built on Vue) — check for the Nuxt state object
!!window.__NUXT__

If any of these return true, the site is running Vue. The __VUE__ check is the most reliable for Vue 3 apps because Vue itself sets this flag during initialization, regardless of how the app is bundled.

Inspect the DOM for Vue Data Attributes

Vue components leave visible traces in the HTML. In the Elements panel, look for these patterns:

// Vue scoped style attributes (both v2 and v3)
document.querySelectorAll('[class*="data-v-"]').length > 0
// or look for attributes like data-v-1a2b3c4d on elements

// Vue 2: __vue__ property on component root elements
$0.__vue__

// Vue 3: __vue_app__ on the mount element
document.querySelector('#app').__vue_app__

The data-v- attributes are the most visible sign of Vue. They are hash-based scoped style identifiers that Vue’s Single File Component (SFC) compiler adds to every element that has scoped CSS. These attributes appear in the rendered HTML and survive minification, making them a reliable detection signal.

Method 2 — View Page Source Markers

Viewing the HTML source (Ctrl+U or Cmd+Option+U) reveals patterns that indicate Vue, even before JavaScript executes.

Vue-Specific Script Tags and CDN References

Vue apps often include script tags that reference the Vue library directly. Search the page source for these patterns:

• vue.global.prod.js or vue.runtime.global.prod.js — Vue 3 production builds loaded from a CDN.
• vue.min.js or vue.runtime.min.js — Vue 2 production builds.
• CDN URLs containing cdn.jsdelivr.net/npm/vue or unpkg.com/vue — Direct Vue library references.
• data-v- attributes scattered throughout the HTML — The scoped style attributes from Vue SFCs, visible even in the raw source of server-rendered pages.

For client-side rendered Vue apps, the HTML source is often minimal—just a <div id="app"></div> and script tags. This empty shell pattern is shared with React and Angular SPAs, so the id="app" alone is not definitive. Look for Vue-specific script filenames or data-v- attributes in the bundled output to confirm.

Nuxt.js Server-Rendered Markers

Nuxt.js is the Vue equivalent of Next.js—a full-featured framework that adds server-side rendering, static generation, and file-based routing on top of Vue. Nuxt sites have distinctive markers in the page source:

• window.__NUXT__ — A script block containing serialized application state, routing data, and server-fetched data. This is the single most reliable indicator of Nuxt.js.
• /_nuxt/ prefixed asset paths — All static assets in Nuxt are served from this directory, similar to how Next.js uses /_next/.
• data-server-rendered="true" — Attribute on the root element indicating Vue SSR was used. Present in both Nuxt and custom Vue SSR setups.
• data-n-head attributes — Added by Nuxt’s head management (vue-meta in Nuxt 2, useHead in Nuxt 3).

<!-- Nuxt.js fingerprint in page source -->
<div id="__nuxt">
  <div id="__layout">
    <!-- Full server-rendered HTML with data-v- attributes -->
  </div>
</div>
<script>window.__NUXT__={serverRendered:true,config:{...},data:[...]}</script>

Method 3 — Browser Extensions

Vue.js DevTools Extension

The official Vue.js DevTools extension (available for Chrome and Firefox) is the most definitive manual check. When you visit a Vue-powered site, the extension icon lights up—colored for Vue 3, gray for Vue 2 production builds. It adds a “Vue” tab to DevTools, letting you inspect the component tree, Vuex/Pinia stores, routes, and reactive state.

The extension detects Vue by looking for the __VUE_DEVTOOLS_GLOBAL_HOOK__ that it injects and the __vue__ or __vue_app__ properties on DOM nodes. If Vue is present anywhere on the page—even in a small embedded widget—the extension will detect it.

The limitation: you have to visit each site individually. This is fine for one-off checks but impractical if you need to scan hundreds of sites.

DetectZeStack Chrome Extension

The DetectZeStack Chrome extension detects not just Vue but the entire technology stack—frameworks, CDNs, analytics tools, hosting providers, and more—all from a single toolbar click. Unlike Vue DevTools, which only identifies Vue, DetectZeStack shows the full picture: whether the site also uses Nuxt.js, what CDN or hosting provider serves it, what analytics and marketing tools are loaded, and more.

Method 4 — HTTP Header and Meta Clues

Vue itself does not set any HTTP response headers. However, the ecosystem around Vue leaves header-level traces that indicate Vue usage:

• X-Powered-By: Nuxt — Some Nuxt deployments include this header (though many production setups strip it for security).
• Server headers from Nuxt hosting platforms: If the site is deployed on Vercel or Netlify and you detect Nuxt markers in the HTML, the hosting header corroborates the Vue detection.
• Link preload headers: Nuxt uses <link rel="preload"> tags for /_nuxt/ assets. While these are in the HTML rather than HTTP headers, they serve a similar diagnostic purpose.

Open DevTools, switch to the Network tab, reload the page, and click the initial document request. Check the Response Headers section for any of these signals. Then examine the HTML response body for data-v- attributes and __NUXT__ scripts.

Method 5 — DetectZeStack API (Programmatic Detection)

Manual methods work for spot checks. When you need to detect Vue across tens, hundreds, or thousands of sites—for lead qualification, competitive analysis, or security scanning—you need an API.

Single-URL Analysis with curl

The DetectZeStack API detects Vue.js, Nuxt.js, and 7,200+ other technologies in a single request. Here is a quick check using the free demo endpoint (no API key required):

$ curl -s "https://detectzestack.com/demo?url=gitlab.com" | jq '.technologies[] | select(.name == "Vue.js" or .name == "Nuxt.js")'

For production use with higher limits, use the RapidAPI endpoint:

$ curl -s "https://detectzestack.p.rapidapi.com/analyze?url=gitlab.com" \
  -H "X-RapidAPI-Key: YOUR_KEY" \
  -H "X-RapidAPI-Host: detectzestack.p.rapidapi.com" \
  | jq '.technologies[] | select(.categories[] | contains("JavaScript frameworks"))'

Reading the API Response

The API returns a JSON object with all detected technologies. Here is what a Vue.js detection looks like in the response:

{
  "url": "https://gitlab.com",
  "domain": "gitlab.com",
  "status": 200,
  "scan_depth": "full",
  "technologies": [
    {
      "name": "Vue.js",
      "categories": ["JavaScript frameworks"],
      "confidence": 100,
      "website": "https://vuejs.org"
    },
    {
      "name": "Nuxt.js",
      "categories": ["JavaScript frameworks"],
      "confidence": 100,
      "website": "https://nuxt.com"
    }
  ]
}

Key fields to look at:

• name — The technology name. Vue.js and Nuxt.js are reported separately, so you can distinguish between the two.
• confidence — How certain the detection is (0-100). A confidence of 100 means the fingerprint matched unambiguously.
• version — When detectable, the specific Vue version. Useful for security auditing—Vue 2 sites that have not migrated to Vue 3 are running on an end-of-life framework.
• categories — Vue.js appears under “JavaScript frameworks.” This lets you filter the response to only show front-end frameworks.

Batch Detection Across Multiple Sites

To scan a list of domains for Vue usage, loop through them with curl or use a script. Here is a quick bash one-liner:

$ for domain in gitlab.com behance.net alibaba.com; do
    echo -n "$domain: "
    curl -s "https://detectzestack.p.rapidapi.com/analyze?url=$domain" \
      -H "X-RapidAPI-Key: YOUR_KEY" \
      -H "X-RapidAPI-Host: detectzestack.p.rapidapi.com" \
      | jq -r '[.technologies[] | select(.name == "Vue.js" or .name == "Nuxt.js") | .name] | if length == 0 then "not detected" else join(", ") end'
  done

For larger-scale scanning, see the Python tutorial which covers batch scanning with rate limiting and CSV export.

Vue.js vs Nuxt.js — What the Detection Tells You

Every Nuxt site uses Vue, but not every Vue site uses Nuxt. Understanding the distinction matters for competitive analysis and technical assessment:

When the DetectZeStack API reports both “Vue.js” and “Nuxt.js,” it means the site uses Nuxt as the framework layer on top of Vue. If only “Vue.js” is reported, the site uses Vue directly—possibly with Vite, Vue CLI, Quasar, or a custom setup.

This distinction matters for sales and competitive intelligence. A Nuxt site has invested in SSR and SEO—they care about organic search traffic and page performance. A client-side Vue SPA suggests a dashboard or internal tool where SEO is not a priority. For a broader overview of detecting all JavaScript frameworks, see How to Detect What JavaScript Framework a Website Uses.

Get Started with Programmatic Vue Detection

Manual checks are fine for occasional curiosity. For anything systematic—lead qualification, competitive research, security scanning, or portfolio analysis—an API is the only practical approach.

The DetectZeStack API gives you Vue.js detection plus 7,200+ other technology fingerprints in a single call. Every request also includes DNS-based infrastructure detection, TLS certificate analysis, and CPE identifiers for vulnerability lookups—layers that no browser-based method can match.

The free tier includes 100 requests per month with no credit card required. That is enough to scan your competitor list, audit a client portfolio, or build a proof-of-concept integration.