4

我目前正在爲我的個人網站使用Create-React-App。我不斷收到我每次運行時出現以下錯誤:Create-React-App無法編譯|導入/第一個錯誤

./src/~/react-router-dom/es/index.js 
Line 3: Import in body of module; reorder to top import/first 
Line 5: Import in body of module; reorder to top import/first 
Line 7: Import in body of module; reorder to top import/first 
Line 9: Import in body of module; reorder to top import/first 
Line 11: Import in body of module; reorder to top import/first 
Line 13: Import in body of module; reorder to top import/first 
Line 15: Import in body of module; reorder to top import/first 
Line 17: Import in body of module; reorder to top import/first 
Line 19: Import in body of module; reorder to top import/first 
Line 21: Import in body of module; reorder to top import/first 
Line 23: Import in body of module; reorder to top import/first 
Line 25: Import in body of module; reorder to top import/first 

我肯定覺得我失去了一些東西超小,但我無法計算出來。我試着用谷歌搜索錯誤關鍵字'import/first',這導致我認爲這是一個ESLint問題。如果您在我的進口訂單中看到任何問題,請告訴我。我試過不同的進口訂單,但似乎沒有擺脫這個錯誤。

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import { createBrowserHistory } from 'history'; 
import { Router, Route, Redirect, Switch } from 'react-router-dom'; 
import './index.css'; 
import App from './App.js'; 
import Home from './home.js'; 
import About from './about.js'; 
import Contact from './contact.js'; 
import NotFound from './404.js'; 

import registerServiceWorker from './registerServiceWorker'; 

const history = createBrowserHistory(); 

ReactDOM.render(
    <Router history={history}> 
     <App> 
      <Switch> 
       <Route exact path="/" component= {Home} /> 
       <Route path="/about" component= {About} /> 
       <Route path="/contact" component= {Contact} /> 
       <Route path="/404" component= {NotFound} /> 
       <Redirect to= "/404" /> 
      </Switch> 
     </App> 
    </Router>, 
    document.getElementById('root') 
); 
registerServiceWorker(); 

回答

7

這是因爲您不小心將React Router安裝到了src文件夾中。所以linter認爲它是你的代碼並且試圖驗證它。 不要在src內部安裝第三方依賴關係。

刪除src/node_modules並在您的應用的根文件夾中運行npm install。如果某些軟件包丟失,請在根文件夾中運行npm install --save <package-name>,

+0

啊分配const store = configureStore();,你說得對

import configureStore from './redux/common/configureStore'; const store = configureStore(); // Add polyfill for fetch for older browsers import 'isomorphic-fetch'; require('es6-promise').polyfill(); 

例如,這段代碼有一個問題!謝謝!! –

2

對我來說,這是一個案例,因爲我違反了Eslint import/first規則,通過在任何其他導入之前調用導入的函數。因爲我打電話之前import 'isomorphic-fetch';