Предупреждение: используйте `require("history").createBrowserHistory` вместо `require("history/createBrowserHistory")`
привет, я получаю это предупреждение, и я хочу, чтобы это предупреждение было решено и не отображалось на вкладке консоли, чтобы я мог загрузить свой код в netlify, и, насколько я прочитал документацию и политики netlify, он говорит предупреждения и ошибки могут быть причиной того, что он не может быть загружен, поэтому мне нужно решить эту проблему
файл index.js
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { BrowserRouter, Route, Link } from 'react-browser-router';
import "../src/assets/css/index.scss";
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<BrowserRouter>
<App />
</BrowserRouter>
);
reportWebVitals();
пакет.json
{
"name": "daryaft-yar",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"axios": "^1.1.3",
"lodash": "^4.17.21",
"prop-types": "^15.8.1",
"react": "^18.2.0",
"react-browser-router": "^2.1.2",
"react-cookie": "^4.1.1",
"react-dom": "^18.2.0",
"react-icons": "^4.6.0",
"react-paginate": "^8.1.4",
"react-scripts": "5.0.1",
"sass": "^1.55.0",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
app.js
import './App.css';
import { Switch, Route, Redirect } from 'react-router-dom';
import React, { Component } from 'react';
import Shop from './Components/shop-bot/shop';
import Home from './Components/shop-bot/botHome';
import Coin from './Components/Coin/coin';
import Wallet from './Components/Wallet/wallet';
import AddCoin from './Components/AddCoin/add-coin';
import Cart from './Components/cart/cart';
import FinalCart from './Components/final-cart/final-cart';
import UserForm from './Components/user-from/user-form';
class App extends Component {
componentDidMount() {
}
render() {
return (
<React.Fragment>
<Switch >
<Route path = "/bot/shop" component = {Shop}/>
<Route path = "/bot/home" component = {Home} />
<Route path = "/bot/coin" component = {Coin} />
<Route path = "/bot/buy-coin" component = {AddCoin} />
<Route path = "/bot/wallet" component = {Wallet} />
<Route path = "/bot/cart" component = {Cart} />
<Route path = "/bot/cart-final" component = {FinalCart} />
<Route path = "/bot/user-data" component = {UserForm} />
<Redirect from = "/" exact to = "/bot/shop" />
</Switch>
</React.Fragment>
);
}
}
export default App;
Я не использовал методы, упомянутые в моем коде, и я не знаю, как это сделать, как говорит мне предупреждение.
Есть ли какая-нибудь трассировка стека кода, которой вы можете поделиться?
к сожалению, нет
Ну, к сожалению, довольно сложно помочь диагностировать код, который мы не видим. Можете ли вы поделиться тем, как вы используете react-router-dom и настраиваете свой маршрутизатор и маршруты?
Я использую <BrowserRouter><App /></BrowserRouter> в файле index.js и app.js. Я использую <Switch > и несколько компонентов <Route />.
Пожалуйста, добавляйте соответствующие примеры кода в свой пост, а не в комментарии, форматирование работает намного лучше для удобочитаемости в посте, чем в комментариях. Похоже, вы используете react-router-dom@5. Можете ли вы также поделиться своим файлом package.json в сообщении?
это сделано, как вы сказали, я поделился файлами app.js, package.json и app.js
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Честно говоря, "react-browser-router": "^2.1.2", в файле package.json кажется ошибкой.
- я не думаю, что это необходимо
- Вам не хватает
react-router-domв качестве зависимости.
Я предлагаю удалить react-browser-router и установить react-router-dom@5, чтобы компоненты Switch и Redirect можно было импортировать. Установка последней версии RRDv5 важна, так как возможны проблемы с react@18 и компонентом React.StrictMode, а также с версиями RRDv5 ниже v5.3.3, и если вы не укажете v5, будет установлена последняя версия v6, в которой много критических изменений.
Из терминала в корневом каталоге проекта запустите:
npm uninstall --save react-browser-router
npm install --save react-router-dom@5
Обновите файл index.js, чтобы импортировать BrowserRouter из react-router-dom.
import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';
import { BrowserRouter } from 'react-router-dom';
import "../src/assets/css/index.scss";
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
<BrowserRouter>
<App />
</BrowserRouter>
);
Отсюда вы должны перезапустить приложение локально, чтобы убедиться, что все в порядке и работает, прежде чем снова развертывать приложение.
Предупреждение кажется довольно прямолинейным, сообщая, что вы хотите изменить. Вы пытались применить исправление к своему коду? Можете ли вы отредактировать пост, чтобы предоставить полный минимальный воспроизводимый пример соответствующего кода, выдающего предупреждение?