[英]React: Module not found: Can't resolve 'react-router-dom' in '/usr/src/app/src'
我在 docker 容器中運行 REST API 。 我正在構建頁面,當我啟動服務器時,我得到:
Starting the development server...
Failed to compile.
./src/App.js
Module not found: Can't resolve 'react-router-dom' in '/usr/src/app/src'
當我刷新瀏覽器時,我看到以下錯誤Error: Cannot find module 'react-router-dom'
I've tried every npm install 我能找到,因為這似乎是每個人的問題:
npm install -S react-router-dom
npm install react-router-dom --save
npm i react-router-dom --save
在 package.json 中,我看到了依賴項:
{
"name": "app",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"bootstrap": "^4.4.1",
"react": "^16.13.1",
"react-bootstrap": "^1.0.0",
"react-dom": "^16.13.1",
"react-router-dom": "^5.1.2",
"react-scripts": "3.4.1",
"styled-components": "^5.1.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"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 React, { Component } from 'react';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom';
import { Home } from './Home';
import { Developers } from './Developers';
import { Pricing } from './Pricing';
import { Login } from './Login';
import { NoMatch } from './NoMatch';
class App extends Component {
render() {
return (
<React.Fragment>
<Router>
<Switch>
<Route exact path = "/" component={Home} />
<Route path="/developers" component = {Developers} />
<Route path="/pricing" component = {Pricing} />
<Route path="/login" component = {Login} />
<Route component={NoMatch} />
</Switch>
</Router>
</React.Fragment>
);
}
}
export default App;
我的 index.js 文件
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { BrowserRouter as Router } from 'react-router-dom';
ReactDOM.render(
<React.StrictMode>
<App />
</React.StrictMode>,
document.getElementById('root')
);
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
serviceWorker.unregister();
任何幫助是極大的贊賞!
你可能錯過了:
import { BrowserRouter as Router, Route } from 'react-router-dom';
並且因為使用 Docker刪除您的圖像並重新創建它們。 這解決了問題。
如果沒有,請執行以下操作:
index.js 應該是這樣的
import React from 'react'; import ReactDOM from 'react-dom'; import './index.css'; import App from './App'; import * as serviceWorker from './serviceWorker'; import { BrowserRouter as Router } from 'react-router-dom'; ReactDOM.render(, document.getElementById('root')); serviceWorker.unregister();
重啟開發服務器
npm i react react-dom react-router-dom
請提供反饋(評論)是什么解決了您的問題並將此答案標記為已接受
您是否嘗試重新安裝 npm 因為有時 npm 版本不符合庫要求
因為這是在 Docker 中運行的。
我不得不命令make install dev
這似乎解決了一切
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.