TypeError: Không thể đọc thuộc tính 'đính kèm' của makeStyles.js không xác định


15

Khi cố gắng truy cập thành phần Đăng nhập của ứng dụng MERN của tôi trên phiên bản sản xuất, tôi nhận được một loạt các lỗi loại sau được hiển thị trong hình ảnh này:

nhập mô tả hình ảnh ở đây

Ứng dụng của tôi ( https://github.com/ahaq0/kumon_schedule ) hoạt động hoàn toàn tốt tại địa phương và đã hoạt động hoàn toàn tốt được lưu trữ trên Heroku vào hôm nay.

Tôi đã cố gắng khôi phục tất cả các thay đổi trong mã mà tôi đã thực hiện ngày hôm nay nhưng không có kết quả. Tương tự, tôi đã kiểm tra gói.json (và .lock) để xem liệu tôi có thay đổi phụ thuộc UI vật liệu hay không nhưng điều đó cũng tương tự. Tôi dường như không thể hiểu tại sao nó ngừng hoạt động đột ngột trên phiên bản được lưu trữ ở đây .

Mã cho dòng lỗi dưới đây. Tuy nhiên, tôi đã không viết vì đây là một phần của giao diện người dùng vật chất.

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;

Đây là ứng dụng được triển khai đầu tiên của tôi và tôi không biết mọi thứ đã chuyển từ hoạt động sang không hoạt động như thế nào mặc dù tôi đã cố gắng hết sức để đẩy mọi thứ trở lại.

Biên tập. Tôi nên đề cập đến việc tôi đã thử nghiệm trên Firefox cũng như Chrome nơi có nhật ký lỗi.

Chỉnh sửa # 2. Sau khi gỡ lỗi nhiều hơn, tôi phát hiện ra rằng lỗi đã biến mất nếu tôi quay lại cam kết fccc55a5 qua Heroku. Tuy nhiên, nếu tôi tạo một nhánh mới với cam kết đó và cố gắng triển khai nhánh đó, nó sẽ không hoạt động.

Vui lòng xem tại đây https://github.com/ahaq0/kumon_schedule/compare/fccc55a5...fccc55a5

Khi tôi trở lại bản dựng cuối cùng trong Heroku, nó sẽ hoạt động. Nhưng nếu tôi hợp nhất cam kết trước đó vào một nhánh mới và cố gắng triển khai nó, nó sẽ không thành công.


Điều này đã được sửa chưa?
Mike K

Bạn có thể giải quyết nó tạm thời bằng câu trả lời của tôi: stackoverflow.com/a/59514748/3971297
Alfonso M. García Astorga

Câu trả lời:


10

Thêm "jss": "10.0.0" vào "phụ thuộc": {} đã khắc phục sự cố cho tôi

--- Cập nhật 30.12.19 ---

"jss" hiện có thể được gỡ bỏ,

lỗi đã được sửa trong:

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

1
Điều đó hiệu quả với tôi, cảm ơn, nếu bạn đang gặp phải vấn đề này, hãy kiểm tra phiên bản lõi vật liệu-ui bạn đã cài đặt, nâng cấp nó (hoặc nếu bạn đang sử dụng "^ 4.XX"), chỉ cần xóa node_modules, cộng với gói.lock. json hoặc Sợi.lock.json và thực hiện cài đặt npm mới
Braulio

6

Nếu bạn đang sử dụng yarnnhư tôi, thì bạn có thể giải quyết nó bằng cách thêm một resolutionstrường vào phiên bản package.jsonnhắm mục tiêu của bạn jss 10.0.0.

package.json nên trông như thế này:

{

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

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

Tôi cũng đã chia sẻ giải pháp của mình trên Github (và dường như nó có hiệu quả với những người khác): https://github.com/mui-org/m vật liệu-an / issues / 19005 #issuecomment-569447204

Hãy chấp nhận câu trả lời nếu nó cũng làm việc cho bạn! :)


Làm thế nào bạn biết đây là vấn đề?
Mike K

2
@MikeK vì jss 10.0.1phiên bản đã xuất bản các thay đổi vi phạm phá vỡ các bài kiểm tra đơn vị UI UI. Thêm thông tin tại: github.com/cssinjs/jss/issues/1249
Alfonso M. García Astorga

3

Trong trường hợp của tôi, nó đã được giải quyết bằng cách loại bỏ thành phần Box.


1

Tôi đang phải đối mặt với vấn đề tương tự. Nó xảy ra bởi vì tôi đã cập nhật @ liệu-ui / core ^ 4.4.0 thành @ liệu-ui / core ^ 4.8.1. Có thể phá vỡ các thay đổi trong phiên bản mới hoặc một lỗi. Phiên bản mới nhất đã phát hành chỉ bốn ngày trước nên có thể chưa có giải pháp. Nhưng đối với vấn đề của bạn, hãy thử hạ cấp xuống @ liệu-ui / core ^ 4.4.0 hoặc phiên bản trước của tài liệu-ui bạn đang sử dụng, nó sẽ hoạt động. Không cần phải quay lại các cam kết trước đó.


Sau khi cập nhật tài liệu-ui npm sẽ cập nhật tất cả các phụ thuộc của nó, vì vậy chỉ cần hạ cấp sẽ không hoạt động. Một giải pháp tốt hơn có thể xóa toàn bộ "nodemodules" thư mục và thay thế package.jsongói-lock.json với cùng một tập tin từ trước đó cam kết (cam kết ngay trước khi cập nhật). Sau đó cài đặt npm, tôi đã làm điều này và mọi thứ đều hoạt động tốt.
Lalit Jharbade

1

Tôi nghĩ vấn đề là do jss và thành phần Box trong @material-ui/core

Cho đến khi nó được sửa, tôi đã cài đặt styled-componentsvà viết lại thành phần 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

Đối mặt với cùng một vấn đề là tốt. Tôi đã ở trên @ liệu-ui / core ^ 4.7.1, tôi vừa đi thử nghiệm và xóa tệp khóa và node_modules. Sau đó, tôi phải đối mặt với vấn đề. Có vẻ như vấn đề là trên các phiên bản @ liệu-ui / kiểu cập nhật.

Đã giải quyết vấn đề bằng cách hoàn nguyên cập nhật @ liệu-ui / core thành 4.6.1, xóa tệp khóa và node_modules, cài đặt lại các gói.


-1

Giải pháp nhanh: xóa thuộc tính '.attach ()' khỏi DynamicSheet.update (đạo cụ). Không nên dùng cho envs sản xuất, tuy nhiên, đây là cách khắc phục nhanh cho mọi envs cục bộ.


-1

bằng cách sử dụng npm:
1- loại bỏ thư mục node_modules và tệp pack-lock.json
2- mở tệp pack.json
3- thay đổi hoặc thêm phần này vào phần phụ thuộc: "@ liệu-ui / core": "^ 4.6.1",
4- npm tôi đã
giải quyết vấn đề của mình

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.