Q: What is a Single File Component (SFC)?

**Target Audience:** Beginners who have seen .vue files but do not know what is inside one or what happens to it. Basic HTML, CSS and JavaScript assumed. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. The compiled JavaScript and CSS in sections 5 and 6 are the real, unedited output of @vue/compiler-sfc 3.5.44, the same compiler @vitejs/plugin-vue calls during a Vite build. The runnable

Q: Can a computed property be writable?

**Target Audience:** Vue developers who know read-only computed and want to know when a writable one is the right tool. **Difficulty:** Medium > **How to read this doc:** Plain language first, then 📌 Interview term: callouts with the vocabulary an interviewer expects. All output below was produced on Vue 3.5.44: the probe with node , the type errors with TypeScript 5 against Vue's own typings, and the component by compiling it with @vue/compiler-sfc<

Q: How do you use TypeScript with Vue (typed props, emits, refs, vue-tsc)?

**Target Audience:** Vue developers adopting TypeScript, or TypeScript developers new to Vue's single file components. **Difficulty:** Medium > **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. Every type error below is real output from `vue-tsc` 3.3.13 with TypeScript 5.9 and `strict: true`; compiled output comes from `@vue/compiler-sfc` 3.5.44; runtime behaviour and warnings come from mounting the components in jsdom on Vue 3.5.44; the `vite build` result is

Question 1

How do you render lists with v-for?

Accepted Answer

**Target Audience:** Beginners who need to show a list of things (products, messages, todos) in a Vue component. Basic JavaScript arrays and objects assumed. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. Every rendered list, DOM-identity check and error message below came from mounting the code on Vue 3.5.44 in jsdom and clicking through it. ## 1. Why This Even Matters — A Story First Imagine you are writing place cards f

Question 2

How do you bind classes and styles dynamically?

Accepted Answer

**Target Audience:** Anyone preparing for a Vue interview. Assumes basic HTML and CSS and a first look at Vue templates.
**Difficulty:** Easy

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts that give you the exact vocabulary. Every rendered class string, style attribute, warning and compiler line quoted below came from running the code on Vue 3.5.44 (compiled with `@vue/compiler-sfc`, mounted in jsdom).

## 1. Why This Even Matters — A Story First

Imagine a

Question 3

What is a Single File Component (SFC)?

Accepted Answer

**Target Audience:** Beginners who have seen .vue files but do not know what is inside one or what happens to it. Basic HTML, CSS and JavaScript assumed. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. The compiled JavaScript and CSS in sections 5 and 6 are the real, unedited output of @vue/compiler-sfc 3.5.44, the same compiler @vitejs/plugin-vue calls during a Vite build. The runnable

Question 4

What is Vue template syntax (interpolation, directives, expressions)?

Accepted Answer

**Target Audience:** Beginners who know basic HTML and JavaScript and are reading Vue templates for the first time. **Difficulty:** Easy > **How to read this doc:** Plain language first, then 📌 Interview term: callouts with the precise vocabulary. Every rendered output, compiled render function, warning and error message below was produced by running the code on Vue 3.5.44 (@vue/compiler-dom for compiler output, the repo verifier for mounted components). ## 1. Why Th

Question 5

Why declare emits and can you validate them?

Accepted Answer

**Target Audience:** Vue developers who emit events from components and want to know what declaring them actually changes.
**Difficulty:** Medium

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. Every log line and warning below came from running the code on Vue 3.5.44, compiled with `@vue/compiler-sfc` and mounted in jsdom, in development and in production mode.

## 1. Why This Even Matters — A Story First

A restaurant kitchen has a list of bells on the wal

Question 6

Can a computed property be writable?

Accepted Answer

**Target Audience:** Vue developers who know read-only computed and want to know when a writable one is the right tool. **Difficulty:** Medium > **How to read this doc:** Plain language first, then 📌 Interview term: callouts with the vocabulary an interviewer expects. All output below was produced on Vue 3.5.44: the probe with node, the type errors with TypeScript 5 against Vue's own typings, and the component by compiling it with @vue/compiler-sfc<

Question 7

How do you use TypeScript with Vue (typed props, emits, refs, vue-tsc)?

Accepted Answer

**Target Audience:** Vue developers adopting TypeScript, or TypeScript developers new to Vue's single file components.
**Difficulty:** Medium

> **How to read this doc:** Plain language first, then `📌 Interview term:` callouts. Every type error below is real output from `vue-tsc` 3.3.13 with TypeScript 5.9 and `strict: true`; compiled output comes from `@vue/compiler-sfc` 3.5.44; runtime behaviour and warnings come from mounting the components in jsdom on Vue 3.5.44; the `vite build` result is

Question 8

Why was Reactivity Transform ($ref, $computed) removed in Vue 3.4?

Accepted Answer

**Target Audience:** Vue developers maintaining or interviewing about code from the 3.2/3.3 era, and anyone curious why Vue still makes you type .value. **Difficulty:** Medium > **How to read this doc:** Plain language first, then 📌 Interview term: callouts. Dates and the deprecation history come from the vuejs/core changelogs, the Vue blog and the original RFC discussion, linked inline. What happens to old code today was checked by compiling and running it on Vue 3.5

Question 9

What is Pinia and why use it?

Accepted Answer

**Target Audience:** Anyone preparing for a Vue interview who knows [ref and reactive](/interview-question/what-is-the-difference-between-ref-and-reactive) — no state-management library experience required. **Difficulty:** Medium > **How to read this doc:** Ideas are explained in plain language first, then tagged with 📌 Interview term: so you also learn the words an interviewer listens for. Every output below was produced on Vue 3.5.44 and pinia 4.1.0: Node scripts on create

Question 10

What is Vapor mode in Vue 3.5+ and how does it differ from the virtual DOM?

Accepted Answer

**Target Audience:** Vue developers who know templates and reactivity and want to understand Vapor mode precisely, including its release status. No compiler background needed. **Difficulty:** Hard > **How to read this doc:** Ideas are explained in plain language first, then tagged with 📌 Interview term: so you also learn the words an interviewer listens for. Vapor output in this doc was produced with **vue 3.6.0-rc.12**, a release candidate: compiled with its @vue/compiler-s

VUE.JSDECODED.

Easy