require("history/createBrowserHistory") 대신 require("history").createBrowserHistory를 응답합니다.

require("history/createBrowserHistory") 대신 require("history").createBrowserHistory를 응답합니다.

그래서 기본적으로 나는 역사 도서관을 반응으로 사용하는 데 문제가 있다.

최신 버전 때문에 이력 버전을 다운그레이드하려고 하는데 에러에 기재되어 있듯이Support for the latter will be removed in the next major release.그럼 어떻게 바꾸면 좋을까요?어디서 바꾸면 좋을까요?

다음과 같이 되어 있습니다.

Warning: Please use `require("history").createBrowserHistory` instead of `require("history/createBrowserHistory")`. Support for the latter will be removed in the next major release.

그리고.

Warning: Please use `require("history").createHashHistory` instead of `require("history/createHashHistory")`. Support for the latter will be removed in the next major release.

나는 그것을 어떻게 고쳐야 할지 잘 모르겠어요.

import createHistory from './history'

import { applyMiddleware, compose, createStore } from 'redux'
import { routerMiddleware } from 'connected-react-router'
import { persistStore, persistReducer } from 'redux-persist'
import storage from 'redux-persist/es/storage'
import thunk from 'redux-thunk'
import createRootReducer from './reducers'

export const history = createHistory();

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
const persistConfig = {
  key: 'root',
  storage
};

const reducers = persistReducer( persistConfig, createRootReducer(history));
const exampleMiddleware =  store => next => action => {
  // if (action.type === 'message'){
  //   do something
  // } else {
  //   next(action);
  // }
}

export default () => {
  const store = createStore(
    reducers,
    composeEnhancers(applyMiddleware(routerMiddleware(history), thunk, exampleMiddleware))
  );
  let persistor = persistStore(store)

  return  { store, persistor }
}

import React, { Component } from 'react';
import { Provider, ReactReduxContext } from 'react-redux';
// import { createStore } from 'redux';
import { ConnectedRouter } from 'connected-react-router'
import { PersistGate } from 'redux-persist/integration/react'

import configureStore, { history } from './configureStore'
import Routers from './Routers';

const { persistor, store } = configureStore();

class App extends Component {
  render() {
    return (

      <Provider store={store} context={ReactReduxContext}>
        <div> SYNTIFY </div>
        <PersistGate loading={null} persistor={persistor}>

          <ConnectedRouter history={history} context={ReactReduxContext}>
            <Routers />
          </ConnectedRouter>

        </PersistGate>
      </Provider>

    );
  }
}

export default App;

history.disclosing

import createHistory from 'history/createBrowserHistory';
export default createHistory;

오류가 표시되므로 아무것도 렌더링되지 않습니다.

수입품creatBrowserHistory대괄호로 묶습니다.이름 있는 내보내기로 내보냅니다.

// history.js

import { createBrowserHistory } from "history";
export default createBrowserHistory(); 

그런 다음 인덱스에서 가져와 사용합니다.

// index.js
import history from "./history";
import { Provider } from "react-redux";
import store from "./store/store";

const AppContainer = () => (
    <Router history={history}>
        <Provider store={store}>
             <Route path="/" component={App} />
        </Provider>
    </Router>
);

나는 이것을 바꿨다.
import createHistory from 'history/createBrowserHistory'

여기에import { createBrowserHistory } from 'history'

제 코드로 이 에러는 유닛테스트 실행 시 발생합니다.ES6 코드를 다르게 해석함으로써 효소 또는 농담도 가능하다.패키지 이력 내보내기 기본값을 설정합니다.

지금 Import 코드

import { createBrowserHistory } from 'history'

여기 다 있습니다history.js코드

import { createBrowserHistory } from 'history';
export default createBrowserHistory(); 

위의 솔루션을 승인하는 것만으로는 충분하지 않았습니다.

import { createBrowserHistory } from "history";
export default createBrowserHistory(); 

업데이트하여 이 문제를 해결했습니다.react-router그리고.react-router-dom대상:

"react-router": "^5.3.3",
"react-router-dom": "^5.3.3"

goto node_module > dva > lib > index.module

index.displaces를 표시합니다.

출처 : https://www.cnblogs.com/fairylee/p/11198868.html

그 제안을 사용하여 렌더링 콘솔의 오류를 제거할 수 있었습니다.

// NO IMPORT ABOVE  (just set the import directly to a variable)
    const history = require("history").createBrowserHistory()


// then you can 
if( *some-requirement*){
history.push("/desiredRoute")
}. 
// right from your App.js

이것을 시험해 보세요.이 버전의 설치react-router-dom@5.2.0에러가 있는 경우는, 인스톨 합니다.webpack@3.1.0.

이력을 위한 새 파일을 만들고

    import createHistory from 'history/createBrowserHistory';
    export default createHistory();

'작동할 기록에 대해 생성된 파일 경로'에서 기록을 가져옵니다.

이 수입품은 나에게 효과가 있었다.var createHistory = require('history').createBrowserHistory;이 Import 대신import createHistory from 'history/createBrowserHistory';이력 파일은 다음과 같습니다.

var createHistory = require('history').createBrowserHistory;
export default createHistory();

React-Router-Dom 라이브러리 업데이트

실을 사용하는 경우

= > 라고 써 주세요.yarn add React-Router-Dom

현재 버전의 라우터 라이브러리로 자동 갱신됩니다.

이것처럼.

이거 먹어봐

• 에 가다node_modules/history/createBrowserHistory그리고 경고에 따라 행동하라

• 삭제('createBrowserHistory')는 새 줄에 있는 다음과 같이 바꿉니다.require("history").createBrowserHistory

그리고나서

• 에 가다node_modules/history/createHashHistory

• delete('createHashHistory')는 새 행에서 다음과 같이 바꿉니다.require("history").createHashHistory

API 이행이 필요합니다.

// createBrowserHistory  was createHistory in createBrowserHistory
import { createBrowserHistory as history} from 'history'

import { Provider } from "react-redux";
import store from "./store/store";

const AppContainer = () => (
    <Router history={history}>
        <Provider store={store}>
             <Route path="/" component={App} />
        </Provider>
    </Router>
);

Thx에서 @CrsCaballero로

언급URL : https://stackoverflow.com/questions/55466802/react-requirehistory-createbrowserhistory-instead-of-requirehistory-crea