侧边栏壁纸
博主头像
龍啓博主等级

行动起来,活在当下

  • 累计撰写 23 篇文章
  • 累计创建 23 个标签
  • 累计收到 2 条评论

目 录CONTENT

文章目录

vue3 setup中使用defineOptions

龍啓
2023-05-04 / 0 评论 / 0 点赞 / 411 阅读 / 1270 字

vue3.3已支持,不需要再安装

安装

npm i -D unplugin-vue-define-options @vue-macros/volar

yarn add -D unplugin-vue-define-options @vue-macros/volar

pnpm add -D unplugin-vue-define-options @vue-macros/volar
// vite.config.ts
import DefineOptions from 'unplugin-vue-define-options/vite'

export default defineConfig({
  plugins: [DefineOptions()],
})

TypeScript支持

// tsconfig.json
{
  "compilerOptions": {
    // ...
    "types": ["unplugin-vue-define-options/macros-global" /* ... */]
  }
}

基本用法

<script setup lang="ts">
import { useSlots } from 'vue'
defineOptions({
  name: 'Foo',
  inheritAttrs: false,
})
const slots = useSlots()
</script>

Volar配置

// tsconfig.json
{
  "vueCompilerOptions": {
    "target": 3, // or 2.7 for Vue 2
    "plugins": [
      "@vue-macros/volar/define-options"
      // ...more feature
    ]
  }
}

更多使用细节请看文档

0

评论区