vuejs/core

The package you actually install. It holds almost no logic — it re-exports the runtime and picks which build you get: runtime-only, or the full build that bundles the compiler so templates can be compiled in the browser.

import { createApp } from 'vue'

The platform-agnostic runtime: component instances, the virtual DOM diff, lifecycle hooks, provide / inject, the scheduler. It never touches a DOM — you hand it node operations and it drives any target.

createRenderer({ createElement, patchProp,
  insert, remove, … })

The browser half. It gives runtime-core its node operations — creating elements, deciding whether a binding is an attribute or a property, patching class and style — plus Transition and v-show.

import { createApp } from '@vue/runtime-dom'

Parses a template into an AST, runs the transform passes — directives, static hoisting, patch flags that tell the runtime exactly what can change — and generates render function source. Emits code, never runs it.

baseCompile(template, options)
// → render function source

compiler-core plus everything browser-specific: v-html and v-text, v-model resolved against the actual input type, event modifiers like @click.prevent, and HTML entity and namespace handling.

<input v-model.number="age"
       @keyup.enter="save">

Takes a .vue file apart into its template, script and style blocks and compiles each. This is what implements script setup and the defineProps / defineEmits macros, and rewrites scoped CSS into data-v attribute selectors.

parse(source)
// → { template, script, styles }

A second target for the same AST. Instead of a virtual DOM render function it emits code that pushes HTML strings into a buffer — far cheaper on a server, where nothing will ever be diffed.

push(`<div class="${ssrRenderClass(cls)}">`)

The runtime that executes those compiled SSR functions — renderToString and the streaming variants — and defines the hydration contract the client picks up when it takes over the server-rendered markup.

const html = await renderToString(app)

Internal helpers every other package imports: type guards, camelize and hyphenate, and the PatchFlags / ShapeFlags bit constants that let the compiler and the runtime agree without importing each other.

import { isObject, PatchFlags } from '@vue/shared'

A build of Vue 3 that restores Vue 2 behaviour behind per-feature flags, warning each time one is hit. Alias it over vue and a Vue 2 app boots on 3, then you switch the flags off one at a time.

alias: { vue: '@vue/compat' }