Skip to content

inject() doesn't work in setup() when components are exported #6327 #3352

@fatbone008

Description

@fatbone008

Version

3.0.6

Reproduction link

[APP: git@github.com:fatbone008/vue3-test-demo.git Lib: git@github.com:fatbone008/vue3-test-lib.git](APP: git@github.com:fatbone008/vue3-test-demo.git Lib: git@github.com:fatbone008/vue3-test-lib.git)

Steps to reproduce

  1. In vue3-testing-lib, run lib command to build testing component lib.
  2. In vue3-testing-demo, run npm install path/to/lib, install testing lib above by file mode through npm, and import its
    component(Testing.vue) into Helloworld.vue as a component.
  3. npm run serve to start the demo project.
  4. check the lib component through vue-devtool, the provide is exist but injected variable is undefined. and there is warning in console: [Vue warn]: inject() can only be used inside setup() or functional components.

What is expected?

The inject variable in setup of lib component is available to detect provide correctly, rather than undefined, and there is no vue warning in console.

What is actually happening?

[Vue warn]: inject() can only be used inside setup() or functional components.
But inject() are not used in places other than in setup()

The customized lib component injected variable in setup function can not receive provide.
It seems that inject function can not get currentInstance when debugging in the vue source code.


This happen either by using vue-cli 4.5.x or rollup.js.
here is my rollup.config.js

import esbuild from "rollup-plugin-esbuild";
import vue from "rollup-plugin-vue"; // 处理vue文件

export default {
    input: 'src/components/index.js',
    external: ["vue"],
    plugins: [resolve({ extensions: [".vue"] }), vue(), esbuild()],
    output: {
        file: 'dist/bundle.js',
        format: 'es'
    }
};

and the component in bundle also warning me that inject() can only be used inside setup() or functional components.
But my inject indeed used in setup() function.
And my custom component work well in the lib project without packing.
Is this bundle problem? Do I need some sort of plugin for vue 3 compose API specially?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions