IonReactRouter不是JSX元素的构造函数

时间:2020-03-20 15:29:45

标签: reactjs typescript ionic-framework react-router ionic-react

我正在与离子反应。我已经以与以前开发的其他项目相同的方式安装了bool sort = true; while (sort) { sort= false; for (int i = 1; i <= n-1; i++) { if (letter[i] == letter[i + 1]) { swap(letter[i], letter[i + 2]); sort = true; } } } @ionic/react软件包。在这个项目中,我试图使用汇总来为其他项目生成可重用的组件,但是在这种情况下,@ionic/react-router中出现了一个错误,以下是我的代码:

IonReactRouter

使用此代码,出现以下错误。

import * as React from 'react';
import { IonApp } from '@ionic/react';
import { 
    Route,
    Switch, 
} from 'react-router';
import { IonReactRouter } from '@ionic/react-router';

/*Some Props interfaces*/

export const Router:React.FC<RouterProps> = (props: RouterProps) => (
    <IonApp>
        <IonReactRouter>
            <Routes {...props}/>
        </IonReactRouter>
    </IonApp>
);

export default GalaxyRouter;

这是我的package.json:

(rpt2 plugin) Error: /home/ec2-user/environment/galaxy-components-lib/src/GalaxyRouter/index.tsx(35,9): 
semantic error TS2605 JSX element type 'IonReactRouter' is not a constructor function for JSX elements.

这是我的汇总配置:

{
  "name": "a-lib",
  "version": "0.0.0",
  "description": "",
  "author": "",
  "license": "MIT",
  "repository": "",
  "main": "dist/index.js",
  "module": "dist/index.es.js",
  "jsnext:main": "dist/index.es.js",
  "engines": {
    "node": ">=8",
    "npm": ">=5"
  },
  "scripts": {
    "test": "cross-env CI=1 react-scripts-ts test --env=jsdom",
    "test:watch": "react-scripts-ts test --env=jsdom",
    "build": "rollup -c",
    "start": "rollup -c -w",
    "prepare": "npm run build",
    "predeploy": "cd example && npm install && npm run build",
    "deploy": "gh-pages -d example/build",
    "release": "standard-version"
  },
  "peerDependencies": {
    "prop-types": "^15.5.4",
    "react": "^15.0.0 || ^16.0.0",
    "react-dom": "^15.0.0 || ^16.0.0",
    "@ionic/react": "^5.0.4",
    "@ionic/react-router": "^5.0.4",
    "@material-ui/core": "^4.9.5",
    "@material-ui/icons": "^4.9.1"
  },
  "devDependencies": {
    "@ionic/react": "^5.0.5",
    "@ionic/react-router": "^5.0.5",
    "@material-ui/core": "^4.9.5",
    "@material-ui/icons": "^4.9.1",
    "@svgr/rollup": "^2.4.1",
    "@types/jest": "^23.1.5",
    "@types/react": "^16.9.23",
    "@types/react-dom": "^16.9.5",
    "@types/react-router-dom": "^5.1.3",
    "babel-core": "^6.26.3",
    "babel-runtime": "^6.26.0",
    "cross-env": "^5.1.4",
    "gh-pages": "^1.2.0",
    "react-router": "^5.1.2",
    "react-router-dom": "^5.1.2",
    "react-scripts-ts": "^2.16.0",
    "rollup": "^0.62.0",
    "rollup-plugin-babel": "^3.0.7",
    "rollup-plugin-commonjs": "^9.1.3",
    "rollup-plugin-node-resolve": "^3.3.0",
    "rollup-plugin-peer-deps-external": "^2.2.0",
    "rollup-plugin-postcss": "^1.6.2",
    "rollup-plugin-typescript2": "^0.17.0",
    "rollup-plugin-url": "^1.4.0",
    "standard-version": "^7.1.0",
    "typescript": "^2.8.3"
  },
  "files": [
    "dist"
  ],
  "dependencies": {
    "@types/classnames": "^2.2.10",
    "classnames": "^2.2.6"
  }
}

我不理解为什么这段代码会发生这种情况,而且我也不知道如何调试或修复它。

1 个答案:

答案 0 :(得分:0)

IonReactRouter已移至其自己的程序包,因此请将其添加到您的导入中:

import { IonReactRouter } from '@ionic/react-router';

链接在这里: https://github.com/ionic-team/ionic/issues/18964