Open tobiasdiez opened 11 months ago
@floroz any idea concerning the second point? The generated code currently looks like
const _sfc_main = {
setup(__props, { expose: __expose }) {
__expose();
const MyComponent = {};
const __returned__ = { MyComponent };
Object.defineProperty(__returned__, \\"__isScriptSetup\\", {
enumerable: false,
value: true,
});
return __returned__;
},
};
export default {
component: MyComponent,
//decorators: [ ... ],
parameters: {},
};
So vue is encapsulating everything in the setup
method, which is almost by design. The easiest way would be to simply not support defineMeta
in script setup
but only script
.
@floroz any idea concerning the second point? The generated code currently looks like
const _sfc_main = { setup(__props, { expose: __expose }) { __expose(); const MyComponent = {}; const __returned__ = { MyComponent }; Object.defineProperty(__returned__, \\"__isScriptSetup\\", { enumerable: false, value: true, }); return __returned__; }, }; export default { component: MyComponent, //decorators: [ ... ], parameters: {}, };
So vue is encapsulating everything in the
setup
method, which is almost by design. The easiest way would be to simply not supportdefineMeta
inscript setup
but onlyscript
.
@tobiasdiez so we are unable to reference the parameters of defineMeta
in the scope of the meta default export
.
Supporting only script
instead of script setup
I assume would mean only being able to use the Options API instead of Composition in Vue SFC Story, which would probably defeat the purpose of this addon, since the main selling point is the DX for modern Vue syntax.
I will need some time to play around with the Vue compiler output to gain a better understanding as this seems quite a heavy roadblock to enable more advanced features...
I would compare this to export default
in plain vue. In this case, you also need to use script
instead of script setup
. On the positive side, the following works and should cover most cases:
<script setup lang="ts">
import Button from './Button.vue'
defineMeta({
title: 'Button',
component: Button,
})
</script>
its just when you reference variables that you need to use plain script
:
<script lang="ts">
import Button from './Button.vue'
const title = 'Button'
defineMeta({
title,
component: Button,
})
</script>
Todo: