Vue Vite项目启动后,控制台报错: [@vue/compiler-sfc] defineProps is a compiler macro and no longer needs to be imported.

具体报错提示如:

终端使用 npm run dev 启动项目

$ npm run dev            

> vite-project@0.0.0 dev
> vite
Pre-bundling dependencies:
  vue
(this will be run only when your dependencies or config have changed)
  vite v2.5.0 dev server running at:
  > Local: http://localhost:3000/
  > Network: use `--host` to expose
  ready in 1140ms.

[@vue/compiler-sfc] `defineProps` is a compiler macro and no longer needs to be imported.

这是使用 vite 初始化生成的项目,什么都还也没改呢,怎么就报错。

提示说: ‘defineProps’ 是一个编译宏,不再需要导入。

看看哪里引入defineProps了呢?

搜索项目,在HelloWorld.vue中里发现了它:

即文件: vite-project/src/components/HelloWorld.vue

<template>
  <h1>{{ msg }}</h1>
</template>
<script setup>
import { defineProps, reactive } from 'vue'

defineProps({
  msg: String
})

const state = reactive({ count: 0 })
</script>

解决办法:

将这句:

import { defineProps, reactive } from 'vue'

改成:

import { reactive } from 'vue'

即,删除 defineProps 的引入。

重新运行 npm run dev 即可。

估计是改了语法,但是实例项目没有更新导致的。


【END】

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐