Skip to content

New <script setup> and ref sugar implementation - #2532

Merged
yyx990803 merged 13 commits into
masterfrom
ref-sugar
Nov 17, 2020
Merged

yyx990803 merged 13 commits into
masterfrom
ref-sugar

Conversation

@yyx990803

@yyx990803 yyx990803 commented Oct 30, 2020

Copy link
Copy Markdown
Member

Related RFC: vuejs/rfcs#222

@github-actions

github-actions Bot commented Oct 30, 2020

Copy link
Copy Markdown

Size report

Path Size
vue.global.prod.js 40.15 KB (-0.35% 🔽)
runtime-dom.global.prod.js 26.44 KB (0%)
size-check.global.prod.js 15.95 KB (0%)

@yyx990803

Copy link
Copy Markdown
Member Author

@knightly-bot build this

@knightly-bot

Copy link
Copy Markdown

Nightly Build

🌒 Knightly build enabled, release every night at 00:00 UTC (skip if no change)

📦 npm package

@dajpes

dajpes commented Nov 4, 2020

Copy link
Copy Markdown

How Can I use this new syntax in a new vue project?

@antfu

antfu commented Nov 6, 2020

Copy link
Copy Markdown
Member

Build with Vite is not working (Dev OK). Repro: https://github.com/antfu/vite-starter-ref-sugar

<script setup>
import { computed } from 'vue'

ref: count = 0
ref: doubled = computed(() => count * 2)

const inc = () => count++
const dec = () => count -= 1
</script>

<template>
  <div>{{ count }} * 2 = {{ doubled }}</div>
  <button @click="dec">Dec</button>
  <button @click="inc">Inc</button>
</template>

Dev

image

Build

image

Error: ReferenceError: count is not defined

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants