【问题标题】:Storybook file does not import corresponding .vueStorybook 文件没有导入对应的 .vue
【发布时间】:2021-12-30 18:19:04
【问题描述】:

夏天

我想在storybook文件(component/index.stories.ts)中导入vue文件(component/index.vue)。
但它是编译错误,无法导入。

component/index.stories.ts

import Test from '~/components/test/index.vue' # <- compile error.

export default {
  title: 'Test'
}

export const TestWebsite = () => '<Test />'

这是目录。

project
  ├ pages
  │  └ index.vue
  ├ components
  │  ├ test
  │  │  ├ index.vue
  .  .  └ index.stories.ts
  .  .

我想知道如何解决这个编译错误并成功运行 Storybook。

【问题讨论】:

    标签: vue.js nuxt.js storybook


    【解决方案1】:

    创建 index.d.ts 后,我可以导入 .vue 文件并成功显示在 Storybook 上。

    index.d.ts

    declare module '*.vue' {
      import Vue from 'vue'
      const _default: Vue
      export default _default
    }
    

    index.stories.ts

    import Test from './index.vue'
    
    export default {
      component: Test,
      title: 'Components/Test'
    }
    
    export const Primary = () => ({
      components: { Test },
      template: '<Test />'
    })
    

    【讨论】:

      猜你喜欢
      • 2018-01-21
      • 2021-08-13
      • 1970-01-01
      • 2021-10-13
      • 2020-12-10
      • 2017-11-01
      • 2019-08-25
      • 2020-10-24
      • 2020-06-26
      相关资源
      最近更新 更多