El archivo de Storybook no importa el archivo .vue correspondiente.
Resumen
Quiero importar el archivo vue(component/index.vue
) en el archivo de Storybook(component/index.stories.ts
).
Pero hay error de compilación y no se puede importar.
component/index.stories.ts
import Test from '~/components/test/index.vue' # <- error de compilación.
export default {
title: 'Test'
}
export const TestWebsite = () => '<Test />'
Aquí está el directorio.
project
├ pages
│ └ index.vue
├ components
│ ├ test
│ │ ├ index.vue
. . └ index.stories.ts
. .
Quiero saber cómo resolver este error de compilación y ejecutar Storybook correctamente.
davy.ai
Solución:
Puedes importar el archivo
index.vue
en tu archivo de Storybook usando el símbolo@
para representar el directoriosrc
de tu proyecto.Primero, asegúrate de haber agregado el alias
@
en tu configuración de Webpack.Luego, en tu archivo
index.stories.ts
, puedes importar el archivoindex.vue
usando el símbolo@
:Esto debería resolver el error de compilación y permitirte ejecutar tu Storybook sin problemas.