TypeError: Cannot destructure property 'color' of 'undefined' as it is undefined.

[ldlv1996]

Hi, I'm not if this is the right place to ask but I'm having some trouble setting up Histoire in my application. I have successfully done before. I just can seem to figure out what I'm missing this time. I followed the instructions according to the docs. When I run

yarn story:dev

I get the following error:

[Vue warn]: resolveComponent can only be used in render() or setup().
Error while collecting story [...]/.histoire/plugins/tailwind-tokens/Tailwind.story.vue:6084:57
TypeError: Cannot destructure property 'color' of 'undefined' as it is undefined.

In my project root I've put the files like so

// histoire.config.ts
import { defineConfig } from 'histoire'

export default defineConfig({
    setupFile: 'histoire.setup.ts',
})

//histoire.setup.ts
import './src/index.css'

I also have a tailwind config in my root

module.exports = {
  content: ["./index.html", "./src/**/*.{js,ts,jsx,tsx,vue}"],
  theme: {
    extend: {
      colors: {
        // colors
      },
    },
  },
  plugins: [],
};

And my vite.config.ts file is looking like this

/// <reference types="histoire" />

import { fileURLToPath, URL } from "url";
import { defineConfig, loadEnv } from "vite";
import vue from "@vitejs/plugin-vue";

// https://vitejs.dev/config/
export default defineConfig(({ mode }) => {
  process.env = { ...process.env, ...loadEnv(mode, process.cwd()) };

  return {
    plugins: [vue()],
    base: "/" + process.env.VITE_VUE_APP_SUB_FOLDER,
    resolve: {
      alias: {
        "@": fileURLToPath(new URL("./src", import.meta.url)),
      },
    },
    histoire: {
      // Histoire config can also go here
    },
  };
});

In my json file I have this ("histoire": "^0.7.3")

[Akryum]

Please open a proper bug report so we can look at this. Thanks!