IonReactRouter не является функцией конструктора для элементов JSX - PullRequest
0 голосов
/ 20 марта 2020

Я использую реагирую с Иони c. Я установил пакеты @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;

с этим кодом, следующая ошибка появляется у меня.

(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.

это мой пакет. json:

{
  "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"
  }
}

и это моя конфигурация накопительного пакета:

import typescript from 'rollup-plugin-typescript2'
import commonjs from 'rollup-plugin-commonjs'
import external from 'rollup-plugin-peer-deps-external'
import postcss from 'rollup-plugin-postcss'
import resolve from 'rollup-plugin-node-resolve'
import url from 'rollup-plugin-url'
import svgr from '@svgr/rollup'

import pkg from './package.json'

export default {
  input: 'src/index.tsx',
  output: [
    {
      file: pkg.main,
      format: 'cjs',
      exports: 'named',
      sourcemap: true
    },
    {
      file: pkg.module,
      format: 'es',
      exports: 'named',
      sourcemap: true
    }
  ],
  plugins: [
    external(),
    postcss({}),
    url(),
    svgr(),
    resolve(),
    typescript({
      rollupCommonJSResolveHack: true,
      clean: true
    }),
    commonjs({
      include: 'node_modules/**',
      namedExports: {
        'node_modules/react-is/index.js': ['isValidElementType']
      }
    })
  ]
}

I не понимаю, почему это происходит с этим кодом, и я не знаю, как его отладить или исправить.

...