无法使用以下最简单的网格实现进行编译。 (但是在React JS实现上也是如此)代码如下所示。
import { connect } from 'react-redux'; import * as redux from 'redux'; import * as projectActions from '../../redux/actions/projectActions'; import * as authorActions from '../../redux/actions/authorActions'; import * as React from 'react'; import { bindActionCreators } from 'redux'; import { Project } from '../../interfaces/Project'; import { ApplicationState } from '../../redux/reducers/initialState'; import { Grid } from '@Progress/kendo-react-grid'; interface OwnProps { } type ReduxProps = ReturnType<typeof mapStateToProps> & ReturnType<typeof mapDispatchToProps>; // type Props = StateFromProps & DispatchFromProps & NavbarComponentProps; interface Pprops extends ReduxProps { handleDeleteProject1: (project: Project) => void } class ProjectsPage extends React.Component<Pprops, any> { state = { redirectToAddProjectPage: false }; componentDidMount() { } handleDeleteProject1 = async (project: Project) => { } render() { return ( <> <Grid></Grid> </> ); } } function mapStateToProps( state: ApplicationState , ownProps: OwnProps ) { const projectsList = state.projectsStateSlice.projects; return { projects: projectsList.map(project => { const authorNamee = project.authorId.toString(); return { ...project, authorName: authorNamee }; }), authors: state.authorsStateSlice.authors, loading: 0 }; } function mapDispatchToProps(dispatch: redux.Dispatch) { return { actions: { loadProjects: bindActionCreators(projectActions.loadProjects, dispatch), loadAuthors: bindActionCreators(authorActions.loadAuthors, dispatch), deleteProject: bindActionCreators(projectActions.deleteProject, dispatch) } }; } // prop types declarations export default connect(mapStateToProps, mapDispatchToProps)(ProjectsPage);
我的package.json如下:
{ "name": "cncy-react-redux", "version": "0.1.0", "private": true, "scripts": { "start:dev": "react-scripts start", "prestart:api": "node tools/createMockDb.js", "start:api": "node tools/apiServer.js", "test": "jest", "start": "run-p start:api start:dev" }, "jest": { "setupFiles": [ "./tools/testSetup.js" ], "moduleNameMapper": { "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|mp3|wav|m4a|aac|oga)$": "<rootDir>/tools/fileMock.js", "\\.(css|less)$": "<rootDir>/tools/styleMock.js" } }, "dependencies": { "@fortawesome/fontawesome-svg-core": "^1.2.26", "@fortawesome/free-regular-svg-icons": "^5.12.0", "@fortawesome/free-solid-svg-icons": "^5.12.0", "@fortawesome/react-fontawesome": "^0.1.8", "@reduxjs/toolkit": "^1.2.1", "@testing-library/jest-dom": "^4.2.4", "@testing-library/react": "^9.3.2", "@testing-library/user-event": "^7.1.2", "@types/bootstrap": "^4.3.1", "@types/enzyme": "^3.10.4", "@types/jest": "^24.0.24", "@types/node": "^12.0.0", "@types/react": "^16.9.0", "@types/react-dom": "^16.9.0", "@types/react-redux": "^7.1.5", "@types/react-router-dom": "^5.1.3", "@types/react-toastify": "^4.1.0", "@types/redux": "^3.6.0", "@types/redux-immutable-state-invariant": "^2.1.1", "@types/redux-thunk": "^2.1.0", "@types/reselect": "^2.2.0", "bootstrap": "^4.4.1", "immer": "2.1.3", "node-sass": "^4.13.0", "prop-types": "15.7.2", "react": "^16.12.0", "react-bootstrap": "^1.0.0-beta.16", "react-dom": "^16.12.0", "react-redux": "^7.1.3", "react-router-dom": "^5.1.2", "react-scripts": "3.3.0", "react-toastify": "^5.4.1", "redux": "^4.0.4", "redux-immutable-state-invariant": "^2.1.0", "redux-thunk": "^2.3.0", "reselect": "^4.0.0", "typescript": "~3.7.2", "@progress/kendo-data-query": "1.5.2", "@progress/kendo-date-math": "1.5.1", "@progress/kendo-drawing": "1.6.0", "@progress/kendo-react-animation": "3.9.0", "@progress/kendo-react-buttons": "3.9.0", "@progress/kendo-react-data-tools": "^3.9.0", "@progress/kendo-react-dateinputs": "3.9.0", "@progress/kendo-react-dialogs": "3.9.0", "@progress/kendo-react-dropdowns": "3.9.0", "@progress/kendo-react-excel-export": "3.9.0", "@progress/kendo-react-grid": "3.9.0", "@progress/kendo-react-inputs": "3.9.0", "@progress/kendo-react-intl": "3.9.0", "@progress/kendo-react-layout": "3.9.0", "@progress/kendo-react-pdf": "3.9.0", "@progress/kendo-react-popup": "3.9.0", "react-transition-group": "4.3.0" }, "devDependencies": { "enzyme": "^3.9.0", "enzyme-adapter-react-16": "1.11.2", "fetch-mock": "^8.1.0", "jest": "^24.9.0", "json-server": "0.14.2", "node-fetch": "^2.3.0", "npm-run-all": "4.1.5", "react-test-renderer": "16.8.4", "react-testing-library": "^6.1.2", "redux-immutable-state-invariant": "2.1.0", "redux-mock-store": "^1.5.3", "rimraf": "2.6.3", "style-loader": "0.23.1" }, "eslintConfig": { "extends": "react-app", "settings": { "react": { "version": "detect" } }, "root": true }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] } }
引发以下错误:
./ src / components / projects / ProjectsPage.tsx找不到文件:'main.js'与磁盘上的相应名称不匹配:'。\ node_modules @ Progress \ kendo-react-grid \ dist \ es @ progress'。
[当我挖掘它声称抛出错误的节点模块的目录时,
看起来像这样。\ node_modules @ Progress \ kendo-react-grid \ dist \ es \ main.js
它显然在es内部不包含任何称为@progress的目录(。\ node_modules @ Progress \ kendo-react-grid \ dist \ es @ progress)
仅供参考:我也是持照开发商。
无法使用以下最简单的网格实现进行编译。 (但是对React JS实现的相同工作)react组件的代码如下。从'react -...