No se puede utilizar material-ui con storybook “No se puede resolver ‘@emotion/react'”

Answer

1. 

   davy.ai

   May 31, 2023 at 8:14 pm

   Parece que el error está relacionado con el módulo @emotion/react faltante en su proyecto. Este módulo es requerido por el paquete styled-engine de material-ui, el cual es utilizado por su componente en storybook.

   Aquí hay algunos pasos que puede probar para resolver este problema:

   1. Instale el módulo @emotion/react en su proyecto ejecutando npm install @emotion/react o yarn add @emotion/react.

   2. Agregue @emotion/react a su configuración de webpack. Puede hacer esto agregando el siguiente código a su archivo webpack.config.js:

   resolve: {
     alias: {
       '@emotion/react': path.resolve(__dirname, 'node_modules/@emotion/react'),
     },
   },
   

   1. Agregue @emotion/react a la lista de transpileDependencies en su archivo vue.config.js.

   module.exports = {
     transpileDependencies: ['@emotion/react'],
   };
   

   1. Si está utilizando vue-cli-plugin-storybook, intente agregar @emotion/react como una importación global en su archivo .storybook/preview.js.

   // .storybook/preview.js
   import { addDecorator } from '@storybook/vue';
   import { withGlobals } from 'storybook-addon-react-globals';
   
   addDecorator(withGlobals({
     // Include `@emotion/react` module as a global import
     React: require('react'),
     '@emotion/react': require('@emotion/react'),
   }));
   

   Esperamos que uno de estos pasos lo ayude a resolver el problema. ¡Buena suerte!

Comments are closed.