Set up Master CSS in Vue.js

Guide to setting up Master CSS in your Vue.js project.

If you don't have a Vue.js project, create one first.

Terminal

npm create vue@latest my-appcd my-app

Run the installer from the Vue.js project root. Static is the default: it scans complete class strings and emits ordinary CSS.

Terminal

npm create @master/css@rc -- --framework vue --yes

Run the command to start the Vite dev server.

npm run dev

pnpm run dev

bun run dev

yarn run dev

Now style your first Vue.js component using Master CSS syntax.

localhost:5173

Hello World

src/App.vue

<template>  <h1 class="m-2xl italic font-5xl font-heavy text-neutral">    Hello World  </h1></template>