Subscribe on changes!

script setup: ref imported from a .vue file doesn't work after build

avatar
Dec 5th 2020

Version

3.0.4

Reproduction link

https://github.com/stephanedemotte/_issue-vue3-script-setup

Steps to reproduce

Create a fresh vitejs app

helloworld.vue

<template>
  <div>
    HelloWorld [{{ isActiveTpl }}]
  </div>
</template>

<script>
import { ref } from 'vue'
export const isActive = ref(false)
</script>

<script setup>
const isActiveTpl = isActive
</script>

app.vue

<template>
  <div>
    App [{{ isActive }}]
  </div>
</template>

<script setup>
import { isActive } from './components/HelloWorld.vue'
</script>

What is expected?

the value should be: true / false

What is actually happening?

After build the ref variable output a weird value

If i try to do isActive = !isActive on app.vue, i've got no error on dev, but got Error: Illegal reassignment to import 'isActive' when i try to build


Builded link http://test-vue-export.gaidaandsteph.com/

avatar
Dec 5th 2020

Duplicate of #2699 and already fixed by 085bbd5fe07c52056e9f7151fbaed8f6a2e442b3 (not released yet)

avatar
Dec 5th 2020

But wasn't 085bbd5fe07c52056e9f7151fbaed8f6a2e442b3 included in v3.0.4? The problem here only appears after bundling for prod

avatar
Dec 6th 2020
Screen Shot 2020-12-05 at 8 36 38 PM

Yep, i've tested after the fix

avatar
Dec 7th 2020

Yep, i've tested after the fix

It work fine for me after the fix whether it's dev or build...

avatar
Dec 7th 2020

@CHOYSEN if you build my repo you didn't get that ?

avatar
Dec 8th 2020

@CHOYSEN if you build my repo you didn't get that ?

Yes, i clone your repo and build it, then start a server with koa, it work fine for me

avatar
Dec 8th 2020

@CHOYSEN It's crazy you don't have

{ "_rawValue": false, "_shallow": false, "__v_isRef": true, "_value": false }

After the build ?

I cannot believe it :/ Can you share a screen please ?

I've tried again from scratch, and i've got the same result App [{{ isActive }}] should return App[true] but got App [{ "_rawValue": false, "_shallow": false, "__v_isRef": true, "_value": false }]

avatar
Dec 8th 2020

@stephanedemotte

I find it, you should remove your yarn.lock and node_modules, then run yarn again

avatar
Dec 8th 2020

@stephanedemotte

There are some vue3.0.3 information in the file, which should be caused by this

avatar
Dec 8th 2020

@CHOYSEN thanks a lot, and very sorry for the noise :)