Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
stephanedemotte opened this issue Dec 5, 2020 · 10 comments
Closed
Labels
❗ p4-important Priority 4: this fixes bugs that violate documented behavior, or significantly improves perf. 🐞 bug Something isn't working scope: compiler

Comments

@stephanedemotte
Copy link

stephanedemotte commented Dec 5, 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/

@posva posva added 🐞 bug Something isn't working ❗ p4-important Priority 4: this fixes bugs that violate documented behavior, or significantly improves perf. scope: compiler labels Dec 5, 2020
@yyx990803
Copy link
Member

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

@posva
Copy link
Member

posva commented Dec 5, 2020

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

@stephanedemotte
Copy link
Author

stephanedemotte commented Dec 6, 2020

Screen Shot 2020-12-05 at 8 36 38 PM

Yep, i've tested after the fix

@CHOYSEN
Copy link
Contributor

CHOYSEN commented Dec 7, 2020

Yep, i've tested after the fix

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

@stephanedemotte
Copy link
Author

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

@CHOYSEN
Copy link
Contributor

CHOYSEN commented Dec 8, 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

@stephanedemotte
Copy link
Author

stephanedemotte commented Dec 8, 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 }]

@CHOYSEN
Copy link
Contributor

CHOYSEN commented Dec 8, 2020

@stephanedemotte

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

@CHOYSEN
Copy link
Contributor

CHOYSEN commented Dec 8, 2020

@stephanedemotte

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

@stephanedemotte
Copy link
Author

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

@github-actions github-actions bot locked and limited conversation to collaborators Oct 30, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
❗ p4-important Priority 4: this fixes bugs that violate documented behavior, or significantly improves perf. 🐞 bug Something isn't working scope: compiler
Projects
None yet
Development

No branches or pull requests

4 participants