Ошибка типа ReactJS: l.replaceRule не является функцией

#javascript #node.js #reactjs #react-redux

Вопрос:

Я компилирую проект с помощью npm, который днем ранее работал отлично, а теперь внезапно перестал работать с кодом, ничего не изменив. Ошибка, которую я получаю в браузере, прилагается для справки.

Ошибка, возникающая в браузере

Шаги, которые я выполняю, чтобы очистить компиляцию моего проекта:

 rm -rf package-lock.json 
rm -rf node_modules/
rm -rf build/  
npm install 
npm run build 
 

Мой файл package.json содержит следующие данные:

 {
  "name": "dashboard",
  "version": "1.0.1",
  "description": "Dashboard",
  "author": "Inc.",
  "private": true,
  "scripts": {
    "analyze": "source-map-explorer 'build/static/js/*.js'",
    "start": "PORT=3006 react-scripts start",
    "build": "react-scripts build"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 10",
    "not op_mini all"
  ],
  "dependencies": {
    "@date-io/core": "1.3.13",
    "@date-io/date-fns": "1.3.13",
    "@fullcalendar/core": "4.4.2",
    "@fullcalendar/daygrid": "4.4.2",
    "@fullcalendar/interaction": "4.4.2",
    "@fullcalendar/react": "4.4.2",
    "@material-ui/core": "4.11.0",
    "@material-ui/docs": "4.0.0-beta.3",
    "@material-ui/icons": "4.9.1",
    "@material-ui/lab": "4.0.0-alpha.56",
    "@material-ui/pickers": "3.2.10",
    "@material-ui/styles": "4.10.0",
    "@material-ui/system": "4.9.14",
    "@reduxjs/toolkit": "1.4.0",
    "@sentry/react": "5.30.0",
    "@sentry/tracing": "6.0.4",
    "@types/dragula": "3.7.0",
    "@types/google-map-react": "1.1.8",
    "@types/react": "16.9.46",
    "@types/react-dom": "16.9.8",
    "@types/react-helmet": "5.0.16",
    "@types/react-redux": "7.1.9",
    "@types/react-router-dom": "5.1.5",
    "@types/react-syntax-highlighter": "11.0.4",
    "@types/redux-logger": "3.0.8",
    "@types/styled-components": "5.1.2",
    "axios": "0.21.1",
    "chart.js": "2.9.3",
    "css-vendor": "2.0.8",
    "date-fns": "2.15.0",
    "google-map-react": "1.1.7",
    "immer": "9.0.3",
    "json-logic-js": "2.0.1",
    "jss": "10.4.0",
    "material-ui-dropzone": "2.5.0",
    "moment": "2.29.1",
    "polished": "3.6.5",
    "prop-types": "15.7.2",
    "react": "16.13.1",
    "react-app-polyfill": "1.0.6",
    "react-chartjs-2": "2.10.0",
    "react-date-range": "1.1.3",
    "react-datetime": "3.0.4",
    "react-diff-viewer": "3.1.1",
    "react-dom": "16.13.1",
    "react-dragula": "1.1.17",
    "react-feather": "2.0.8",
    "react-google-login": "5.1.23",
    "react-helmet": "5.2.1",
    "react-jvectormap": "0.0.16",
    "react-perfect-scrollbar": "1.5.8",
    "react-quill": "1.3.5",
    "react-redux": "7.2.1",
    "react-router": "5.2.1",
    "react-router-dom": "5.2.0",
    "react-scripts": "3.4.3",
    "react-syntax-highlighter": "13.5.0",
    "redux": "4.0.5",
    "redux-logger": "3.0.6",
    "styled-components": "5.1.1",
    "typescript": "3.9.7",
    "universal-cookie": "4.0.4"
  },
  "devDependencies": {
    "@types/json-logic-js": "1.2.1",
    "@types/react-date-range": "1.1.4",
    "source-map-explorer": "2.5.2"
  }
}

 

Дайте мне знать, что бы внезапно изменилось, если бы тот же код больше не работал.

Более подробная информация:

 $ npm -v
8.0.0
 
 $ node -v
v16.11.1
 

Правка 1:

строка 129 instrument.ts Функция.прототип.применить.вызов(исходный уровень, глобальная консоль, аргументы);

строка 129 инструмент.ts

Комментарии:

1. Что находится в instrument.ts файле в строке 129?

2. Отредактировал сообщение с ошибкой в файле instrument.ts

Ответ №1:

Я предполагаю, что проблема была с «jss»: «10.4.0» в файле package.json. Пользовательский интерфейс Material также имеет зависимость и добавляет «jss»: «^10.0.3». Я предполагаю, что это может быть связано с конфликтом, который вызвал проблему с функцией replaceRule.

Ответ №2:

Хорошо, так что если вы запустите свой проект

 npm ls jss
 

в нем будут перечислены все пакеты, использующие результат jss
npm ls

Как вы можете видеть, я использую для jss 10.5.1, в то время как material-ui/styles использует 10.8.0. Все, что мне нужно было сделать, это обновить версию jss, чтобы она соответствовала версии, используемой mui/styles

 npm install jss@10.8.0
 

это сработало, также я бы рекомендовал посмотреть в проекте, где вы на самом деле используете jss, и посмотреть, сможете ли вы этого избежать

Комментарии:

1. Это не ответ