Subscribe on changes!

First import `defineProps` and `defineEmit`, compilation result exception

avatar
zce
Jan 23rd 2021

Version

  • vue: 3.0.5
  • @vue/compiler-sfc: 3.0.5
  • vite: 2.0.0-beta.44

Reproduction link

https://github.com/zce/compiler-sfc-issue

Steps to reproduce

$ npm init @vitejs/app my-app
$ cd myapp
$ npm install

./src/components/HelloWorld.vue

import { defineProps, defineEmit, reactive } from 'vue'

defineProps({
  msg: String
})

defineEmit(['update'])

const state = reactive({ count: 0 })
$ npm run dev

What is expected?

Uncaught SyntaxError: Unexpected token ','

The compiled module code:

import { createHotContext as __vite__createHotContext } from "/@vite/client";import.meta.hot = __vite__createHotContext("/src/components/HelloWorld.vue");
import { , reactive } from '/node_modules/.vite/vue.runtime.esm-bundler.js?v=f3e30e51'

// ...

What is actually happening?

This exception should not occur


-import { defineProps, defineEmit, reactive } from 'vue'
+import { reactive, defineProps, defineEmit } from 'vue'

 defineProps({
   msg: String
 })

 defineEmit(['update'])

 const state = reactive({ count: 0 })

Change the import order to return to normal.

As long as they are not imported first

avatar
Jan 27th 2021

Seems to be a duplicate of #2740.

avatar
Jan 28th 2021

Yes, close this.