React-Redux:加载组件失败

时间:2019-08-15 19:41:51

标签: javascript reactjs redux react-redux react-router

我使用react redux,并且出现与导入本地存储在文件夹中的组件有关的错误。

  

./ src / index.js找不到模块:无法解析   'C:\ Users \ Eliott中的'components / LayoutComponents / Localization'   BAYLOT \ Desktop \ Nouveau dossier \ campaign-react \ src'

我删除了我的nodes_modules文件夹,然后再次执行了该操作:

  

纱线安装

但是它仍然不起作用。它工作较早,但是在过去的两个小时中,我一直试图了解他为什么无法访问该组件。

有解决方案的想法吗?

这是在index.js中:

import React from 'react'
import ReactDOM from 'react-dom'
import { Provider } from 'react-redux'
import { logger } from 'redux-logger'
import thunk from 'redux-thunk'
import { routerMiddleware } from 'connected-react-router'
import { createStore, applyMiddleware, compose } from 'redux'
import createSagaMiddleware from 'redux-saga'
import { createHashHistory } from 'history'
import reducers from 'redux/reducers'
import sagas from 'redux/sagas'
import Router from 'router'
import Localization from 'components/LayoutComponents/Localization'
import * as serviceWorker from './serviceWorker'

// app styles
import './global.scss'

const history = createHashHistory()
const sagaMiddleware = createSagaMiddleware()
const routeMiddleware = routerMiddleware(history)
const middlewares = [thunk, sagaMiddleware, routeMiddleware]
if (process.env.NODE_ENV === 'development' && true) {
  middlewares.push(logger)
}
const store = createStore(reducers(history), compose(applyMiddleware(...middlewares)))
sagaMiddleware.run(sagas)

ReactDOM.render(
  <Provider store={store}>
    <Localization>
      <Router history={history} />
    </Localization>
  </Provider>,
  document.getElementById('root'),
)

serviceWorker.register()
export { store, history }

PS:它已经工作了两个小时,所以这不是代码或文件组织错误,而是更多的环境错误(路由器?)

Package.json

{
  "name": "clean-ui-admin-template-cra",
  "version": "2.1.1",
  "private": true,
  "scripts": {
    "start": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "lint-staged": "lint-staged",
    "prettier": "prettier --write \"src/**/*.{js,jsx,ts,tsx,scss,less}\"",
    "eslint": "eslint --ext .js,jsx src",
    "tslint": "tslint \"src/**/*.{ts,tsx}\"",
    "stylelint": "stylelint \"src/**/*.{scss,less}\""
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "src/**/*.{js,jsx,ts,tsx,scss,less}": [
      "prettier --write",
      "git add"
    ],
    "src/**/*.{js,jsx}": [
      "eslint"
    ],
    "src/**/*.{scss,less}": [
      "stylelint"
    ],
    "*.css": [
      "stylelint --fix",
      "git add"
    ]
  },
  "dependencies": {
    "@babel/plugin-proposal-decorators": "^7.3.0",
    "@rowno/sparkline": "^3.0.1",
    "antd": "^3.13.2",
    "babel-plugin-import": "^1.12.0",
    "bootstrap-css-only": "^4.2.1",
    "chart.js": "^2.7.3",
    "chartist": "^0.11.0",
    "chartist-plugin-tooltips-updated": "^0.0.20",
    "classnames": "^2.2.6",
    "connected-react-router": "^6.3.1",
    "customize-cra": "^0.2.14",
    "d3-dsv": "^1.1.1",
    "d3-format": "^1.3.2",
    "d3-time-format": "^2.1.3",
    "enquire-js": "^0.2.1",
    "eslint-config-airbnb": "^17.1.1",
    "eslint-config-prettier": "^4.3.0",
    "firebase": "^5.8.2",
    "google-maps-react": "^2.0.2",
    "here-maps-react": "^0.1.3",
    "history": "^4.7.2",
    "husky": "^1.3.1",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "lint-staged": "^8.1.3",
    "lodash": "^4.17.11",
    "moment": "^2.24.0",
    "node-pre-gyp": "^0.13.0",
    "node-sass": "^4.12.0",
    "nprogress": "^0.2.0",
    "peity-react": "^0.0.7",
    "prop-types": "^15.7.1",
    "qs": "^6.6.0",
    "rc-drawer": "^1.7.7",
    "react": "^16.8.1",
    "react-app-rewire-hot-loader": "^2.0.1",
    "react-app-rewired": "^2.1.3",
    "react-c3js": "^0.1.20",
    "react-chartist": "^0.13.3",
    "react-chartjs-2": "^2.7.4",
    "react-custom-scrollbars": "^4.2.1",
    "react-dom": "^16.8.1",
    "react-draft-wysiwyg": "^1.13.1",
    "react-helmet": "^5.2.0",
    "react-intl": "^2.8.0",
    "react-loadable": "^5.5.0",
    "react-redux": "^6.0.0",
    "react-redux-spinner": "^2.0.0",
    "react-router": "^4.3",
    "react-router-dom": "^4.3.1",
    "react-router-redux": "^4.0.8",
    "react-scripts": "^2.1.5",
    "react-stockcharts": "^0.7.8",
    "redux": "^4.0.1",
    "redux-logger": "^3.0.6",
    "redux-saga": "^1.0.1",
    "redux-thunk": "^2.3.0",
    "store": "^2.0.12",
    "stylelint": "^9.10.1",
    "stylelint-config-prettier": "^4.0.0",
    "stylelint-config-standard": "^18.2.0"
  },
  "devDependencies": {
    "@babel/plugin-proposal-decorators": "^7.3.0",
    "babel-plugin-import": "^1.12.0",
    "customize-cra": "^0.2.14",
    "eslint-config-airbnb": "^17.1.1",
    "eslint-config-prettier": "^4.3.0",
    "husky": "^1.3.1",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "lint-staged": "^8.1.3",
    "node-sass": "^4.12.0",
    "react-app-rewired": "^2.1.3",
    "stylelint": "^9.10.1",
    "stylelint-config-prettier": "^4.0.0",
    "stylelint-config-standard": "^18.2.0"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ]
}

非常感谢您的帮助

0 个答案:

没有答案