TypeError: no se puede leer la propiedad 'adjuntar' de makeStyles.js indefinido


15

Cuando intento acceder al componente de inicio de sesión de mi aplicación MERN en la versión de producción, obtengo una serie de los siguientes errores de tipo que se muestran en esta imagen:

ingrese la descripción de la imagen aquí

Mi aplicación ( https://github.com/ahaq0/kumon_schedule ) funciona perfectamente bien localmente y funcionaba perfectamente bien alojada en Heroku el día de hoy.

Traté de deshacer todos los cambios en el código que hice hoy en vano. Del mismo modo, verifiqué el package.json (y .lock) para ver si cambié la dependencia material de la IU, pero eso fue lo mismo. Parece que no puedo entender por qué dejó de funcionar de repente en la versión alojada aquí .

El código para la línea del error está debajo. Sin embargo, no escribí ya que es parte de la interfaz de usuario material.

if (sheetManager.dynamicStyles) {
    var dynamicSheet = stylesOptions.jss.createStyleSheet(sheetManager.dynamicStyles, _extends({
        link: true
    }, options));
    dynamicSheet.update(props).attach();
    state.dynamicSheet = dynamicSheet;
    state.classes = mergeClasses({
        baseClasses: sheetManager.staticSheet.classes,
        newClasses: dynamicSheet.classes
    });

    if (sheetsRegistry) {
        sheetsRegistry.add(dynamicSheet);
    }
} else {
    state.classes = sheetManager.staticSheet.classes;
}

sheetManager.refs += 1;

Esta es mi primera aplicación implementada y no sé cómo pasó de funcionar a no funcionar a pesar de mis mejores intentos de revertir las cosas.

Editar. Debo mencionar que probé en Firefox y en Chrome de donde proviene el registro de errores.

Editar # 2. Después de mucha más depuración descubrí que el error desaparece si retrocedo para cometer fccc55a5 a través de Heroku. Sin embargo, si hago una nueva rama con esa confirmación e intento implementar esa rama, no funcionará.

Consulte aquí https://github.com/ahaq0/kumon_schedule/compare/fccc55a5...fccc55a5

Cuando vuelva a la última versión en Heroku, funcionará. Pero si fusiono esa confirmación anterior en una nueva rama e intento implementarla, no lo hará.


¿Se solucionó esto?
Mike K

Puede resolverlo temporalmente con mi respuesta: stackoverflow.com/a/59514748/3971297
Alfonso M. García Astorga

Respuestas:


10

Agregar "jss": "10.0.0" a "dependencias": {} solucionó el problema por mí

--- Actualizado 30.12.19 ---

"jss" ahora se puede eliminar,

El error se ha corregido en:

"@material-ui/core": "4.8.2",

1
Eso funcionó para mí, gracias, si está teniendo este problema, verifique la versión del material-ui core que ha instalado, actualícelo (o si está usando "^ 4.XX") simplemente elimine node_modules, más package.lock. json o yarn.lock.json y ejecute una nueva instalación de npm
Braulio

6

Si está utilizando yarncomo yo, puede resolverlo agregando un resolutionscampo a su versión de package.jsonorientación jss 10.0.0.

package.json debería verse así:

{

  "dependencies": {
    "@material-ui/core": "^4.8.1",

  },
  "resolutions": {
    "jss": "10.0.0"
  }
}

También compartí mi solución en Github (y parece que funcionó para otros): https://github.com/mui-org/material-ui/issues/19005#issuecomment-569447204

¡Acepta la respuesta si también te funcionó! :)


¿Cómo sabías que este era el problema?
Mike K

2
@MikeK porque la jss 10.0.1versión ha publicado cambios de última hora que rompen las pruebas unitarias de Material UI. Más información en: github.com/cssinjs/jss/issues/1249
Alfonso M. García Astorga


1

Estoy enfrentando el mismo problema. Ocurrió porque actualicé @ material-ui / core ^ 4.4.0 a @ material-ui / core ^ 4.8.1. Tal vez haya cambios importantes en la nueva versión o un error. La última versión se lanzó hace solo cuatro días, por lo que es posible que aún no haya una solución. Pero para su problema, intente degradar a @ material-ui / core ^ 4.4.0 o la versión anterior de material-ui que estaba utilizando, debería funcionar. No es necesario revertir a las confirmaciones anteriores.


Después de actualizar el material-ui npm actualizará todas sus dependencias, por lo que simplemente la degradación no funcionará. Una mejor solución puede ser eliminar toda la carpeta "nodemodules" y reemplazar package.json y package-lock.json con los mismos archivos del commit anterior (commit justo antes de la actualización). Luego, instale npm, hice esto y todo funciona bien.
Lalit Jharbade

1

Creo que el problema es con jss y el componente Box en @material-ui/core

Hasta que se solucione, he instalado styled-componentsy reescribo el componente Box:

import {
  borders,
  BordersProps,
  display,
  DisplayProps,
  flexbox,
  FlexboxProps,
  palette,
  PaletteProps,
  positions,
  PositionsProps,
  shadows,
  ShadowsProps,
  sizing,
  SizingProps,
  spacing,
  SpacingProps,
  typography,
  TypographyProps,
} from '@material-ui/system';
import styled from 'styled-components';

/*
 * Box with styled-components
 */
export const Box = styled.div<
  BordersProps & DisplayProps & FlexboxProps & PaletteProps & PositionsProps & ShadowsProps & SizingProps & SpacingProps & TypographyProps
>`${borders}${display}${flexbox}${palette}${positions}${shadows}${sizing}${spacing}${typography}`;


-1

Enfrentando el mismo problema también. Estaba en @ material-ui / core ^ 4.7.1, solo fui a experimentar y eliminé el archivo de bloqueo y node_modules. Entonces me enfrenté al problema. Parece que el problema está en @ material-ui / styles versiones actualizadas.

Resolvió el problema volviendo a actualizar @ material-ui / core a 4.6.1, eliminó el archivo de bloqueo y node_modules, instalando paquetes nuevamente.


-1

Solución rápida: elimine la propiedad '.attach ()' de dynamicSheet.update (props). Sin embargo, no es aconsejable para entornos de producción, es una solución rápida para cualquier entorno de desarrollo local.


-1

usando npm:
1- eliminar la carpeta node_modules y el archivo package-lock.json
2- abrir el archivo package.json
3- cambiar o agregar esto en dependencias: "@ material-ui / core": "^ 4.6.1",
4- npm i
resuelto mi problema.

Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.