小编Ole*_*nko的帖子

Vue2动态组件的简单工作示例

<template>
    <div>
        <h1>O_o</h1>
        <component :is="name"/>
        <button @click="onClick">Click me !</button>
    </div>
</template>

<script>
    export default {
        data: () => ({
            isShow: false
        }),
        computed: {
            name() {
                return this.isShow ? () => import('./DynamicComponent') : '';
            }
        },
        methods: {
            onClick() {
                this.isShow = true;
            }
        },
    }
</script>

一切正常，一切都很棒。我开始尝试它如何与 Composition API 一起使用。

<template>
    <div>
        <h1>O_o</h1>
        <component :is="state.name"/>
        <button @click="onClick">Click me !</button>
    </div>
</template>

<script>
    import {ref, reactive, computed} from 'vue'

    export default {
        setup() {
            const state = reactive({
                name: …

我已经通过vue3 - vite导入组件安装了该项目，例如

import Component from '../../../../components/Component.vue'

我只想给 src 文件夹取别名然后做

import Component from '@/components/Component.vue'

这是我的vite.config.js

import vue from '@vitejs/plugin-vue'

/**
 * https://vitejs.dev/config/
 * @type {import('vite').UserConfig}
 */
export default {
    plugins: [
        vue({
            template: {
                compilerOptions: {
                    // ...
                }
            }
        })
    ]
}

我错过了什么吗？我还应该做什么？

我可以dayjs通过将其添加到 vue3 组件中来使用它data()

    import dayjs from 'dayjs'
    
    export default {
      data() {
        return {
          dayjs
        }
      }
    }

然后我将能够在模板中使用它，但这是正确的方法吗？

如果我想配置dayjs并全局使用它怎么办？我试过

    import dayjs from 'dayjs'
    import { createApp } from 'vue'
    const app  = createApp(App)
    
    app.use(dayjs) // doesn't work
    app.dayjs = dayjs // doesn't work
    
    app.mount("#app')

但到目前为止无法让它工作。
正确的做法是什么？