_unref not defined on build

[StevenJPx2]

Environment

Nuxt CLI v3.0.0-rc.4
RootDir: /Users/stevenjohn/Documents/Projects/SAFT/website-v2
Nuxt project info:

---

• Operating System: Darwin
• Node Version: v18.1.0
• Nuxt Version: 3.0.0-rc.3
• Package Manager: yarn@1.22.15
• Builder: vite
• User Config: buildModules, vite, build
• Runtime Modules: -
• Build Modules: @vueuse/nuxt@8.7.4

---

Reproduction

Minimal reproduction

Describe the bug

When a value from a composable is used in a v-bind in CSS, it fails in previewing the build, giving the error _unref is not defined.

Glue fix for people who are facing this issue

Just add this to the top of your vue file wherever you have this use-case:

<script setup>
import {unref as _unref} from 'vue';

// ...
</script>

What I've found

In server.mjs: it is resolving the composable ref value using _unref instead of using vue_cjs_prod.unref. When I did that to the build file, it ran with no issue.

Additional context

No response

Logs

No response

[danielroe]

This looks like it might be an auto import issue.

cc: @antfu

[antfu]

Weird your repro works fine on my side

[StevenJPx2]

It will work on dev, and I'm stackblitz it still works fine in build, but you do get the error message saying that _unref is not defined in the console. When I hosted it on Netlify and also tried running it locally, it kept crashing the entire website.

[DamianGlowala]

@antfu, I have also discovered a weird behavior, might be related to this (ignore underlined ESLint-related v-model warnings).

When I run npm run build with the following indentation of lines 207-209, this is the error that gets shown:

On contrary, when I manually change what ESLint split into three lines to a single line statement, the error isn't shown anymore :)

...that is: v-model:number-of-items-per-page="numberOfItemsPerPage"

numberOfItemsPerPage is a ref()

[cainaf]

i get exactly the same error when using v-bind in css from a composable value (rc.8)... oddly enough it happens only in a couple files where others (also using the same v-bind from the same composable value) the error does not occur. i couldn't understand why

it happens only when running after a build. dev is fine.

@StevenJPx2 suggestion of importing import {unref as _unref} from 'vue'; did solve the problem

[antfu]

This is a Vue bug, close as duplicated for #14550