.vue File — Vue.js Single-File Component

VUE files are Single-File Components (SFCs) for the Vue.js progressive JavaScript framework, encapsulating a component's template (HTML), logic (JavaScript/TypeScript), and styles (CSS/SCSS/Less) in a single file with dedicated <template>, <script>, and <style> blocks. This co-location of concerns makes Vue components self-contained, portable, and easy to reason about. Vue SFCs support scoped styles that apply only to the current component, CSS modules, TypeScript through <script setup lang="ts">, the Composition API for flexible state management, and preprocessors for each section. The <script setup> syntax introduced in Vue 3 provides a more concise and performant way to write component logic with automatic export of top-level bindings. Vue's SFC format is compiled by tools like Vite (with @vitejs/plugin-vue), webpack (with vue-loader), or Rollup into standard JavaScript and CSS. Vue.js has grown to become one of the three major frontend frameworks alongside React and Angular, known for its gentle learning curve, excellent documentation, and progressive adoption model. The Nuxt framework extends Vue with server-side rendering and static site generation capabilities.