0
私は既存のReact(v15)プロジェクトをJSからTypeScript 2に移行しています.2種類のReactコンポーネントをTypeScriptに移行することで、拡張子を.tsx
に変更し、PropTypes
をインターフェイスに更新することから始めました。 package.js
でTypeScriptのコンパイルエラー
新しい依存関係:
"ts-loader": "^1.0.0",
"typescript": "^2.0.7",
"@types/classnames": "0.0.31",
"@types/node": "^6.0.46",
"@types/react": "^0.14.42",
"@types/react-dom": "^0.14.18",
"@types/react-helmet": "0.0.24",
"@types/react-redux": "^4.4.32",
"@types/react-router": "^2.0.38",
"@types/redux": "^3.6.31"
のWebPACKローダー:
module: {
loaders: [
{ test: /\.tsx?$/, loader: 'ts-loader'},
...
]
},
resolve: {
extensions: ['', '.ts', '.tsx', '.js', '.jsx', '.json']
...
}
tsconfig.json:
{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"jsx": "react",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"noImplicitAny": false,
"sourceMap": false,
"inlineSourceMap": true,
"noEmitHelpers": true,
"allowJs": true,
"allowSyntheticDefaultImports": true
},
"include": [
"src/**/*"
],
"exclude": [
"node_modules",
"**/*.spec.ts"
]
}
コンポーネントHome.jsx
:
import * as React from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import styles from './Home.scss';
class Home extends React.Component<{
regions: Array
...
}, {}> {
render() {
return <div>...</div>;
}
}
export default connect(
state => ({
...
}),
dispatch => bindActionCreators(...)
)(Home);
node_modules
を削除し、npm install
を実行しました。
しかし、下記のコンパイルエラーが多発しています。私は間違って何をしていますか? @types/react-router
を使用している場合
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (4,43): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (4,69): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (4,89): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (5,44): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (5,70): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (5,90): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (7,98): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/applyRouterMiddleware.d.ts
[0] (7,118): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/withRouter.d.ts
[0] (3,45): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/withRouter.d.ts
[0] (3,73): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'StatelessComponent'.
[0] project/web-app/node_modules/@types/react-router/lib/withRouter.d.ts
[0] (3,105): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'PureComponent'.
[0] project/web-app/node_modules/@types/react-router/lib/createMemoryHistory.d.ts
[0] (3,57): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'HistoryOptions'.
[0] project/web-app/node_modules/@types/react-router/lib/createMemoryHistory.d.ts
[0] (3,76): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/useRouterHistory.d.ts
[0] (1,10): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/useRouterHistory.d.ts
[0] (1,19): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'HistoryOptions'.
[0] project/web-app/node_modules/@types/react-router/lib/useRouterHistory.d.ts
[0] (1,35): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'HistoryQueries'.
[0] project/web-app/node_modules/@types/react-router/lib/useRouterHistory.d.ts
[0] (1,51): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'CreateHistory'.
[0] project/web-app/node_modules/@types/react-router/lib/match.d.ts
[0] (6,17): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/match.d.ts
[0] (7,18): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/match.d.ts
[0] (12,16): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/match.d.ts
[0] (16,81): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/PropTypes.d.ts
[0] (4,29): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-router/lib/PropTypes.d.ts
[0] (5,30): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-router/lib/PropTypes.d.ts
[0] (6,31): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-router/lib/PropTypes.d.ts
[0] (7,32): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-router/lib/PropTypes.d.ts
[0] (8,27): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-router/lib/PropTypes.d.ts
[0] (9,28): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-router/lib/RouterContext.d.ts
[0] (10,48): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/RouterContext.d.ts
[0] (11,21): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/RouterContext.d.ts
[0] (14,21): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/RouterContext.d.ts
[0] (19,43): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/RouterContext.d.ts
[0] (20,50): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/lib/RouterContext.d.ts
[0] (21,21): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/RouterContext.d.ts
[0] (22,21): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/RouteUtils.d.ts
[0] (4,16): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/lib/useRoutes.d.ts
[0] (4,48): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'CreateHistory'.
[0] project/web-app/node_modules/@types/react-router/lib/useRoutes.d.ts
[0] (4,69): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'CreateHistory'.
[0] project/web-app/node_modules/@types/react-router/lib/RouteContext.d.ts
[0] (3,35): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Mixin'.
[0] project/web-app/node_modules/@types/react-router/lib/Lifecycle.d.ts
[0] (3,32): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Mixin'.
[0] project/web-app/node_modules/@types/react-router/lib/History.d.ts
[0] (9,23): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/History.d.ts
[0] (9,103): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/History.d.ts
[0] (10,26): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Pathname'.
[0] project/web-app/node_modules/@types/react-router/lib/History.d.ts
[0] (10,46): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Query'.
[0] project/web-app/node_modules/@types/react-router/lib/History.d.ts
[0] (14,40): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/History.d.ts
[0] (20,39): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'HistoryQueries'.
[0] project/web-app/node_modules/@types/react-router/lib/Route.d.ts
[0] (3,10): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/Route.d.ts
[0] (11,40): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/Route.d.ts
[0] (23,35): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/Route.d.ts
[0] (24,42): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/lib/Redirect.d.ts
[0] (10,43): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/Redirect.d.ts
[0] (14,19): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Query'.
[0] project/web-app/node_modules/@types/react-router/lib/Redirect.d.ts
[0] (15,19): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'LocationState'.
[0] webpack built 8ae797e4fda263a74f18 in 22518ms
[0] project/web-app/node_modules/@types/react-router/lib/Redirect.d.ts
[0] (17,38): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/Redirect.d.ts
[0] (18,45): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRoute.d.ts
[0] (10,45): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRoute.d.ts
[0] (13,37): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRoute.d.ts
[0] (14,38): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRoute.d.ts
[0] (18,40): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRoute.d.ts
[0] (19,47): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRedirect.d.ts
[0] (10,45): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRedirect.d.ts
[0] (12,16): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Query'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRedirect.d.ts
[0] (13,16): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'LocationState'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRedirect.d.ts
[0] (15,47): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/lib/IndexRedirect.d.ts
[0] (16,40): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (11,39): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'HTMLAttributes'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (11,67): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (12,29): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'CSSProperties'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (15,37): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'LocationDescriptor'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (16,19): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Query'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (17,19): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'LocationState'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (20,34): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/Link.d.ts
[0] (21,41): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (3,5): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'QueryString'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (3,18): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Query'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (4,5): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Location'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (4,15): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'LocationDescriptor'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (4,35): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'LocationState'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (5,5): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'History'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (6,5): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Pathname'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (6,15): error TS2305: Module '"project/web-app/node_modules/history/lib/index"' has no exported member 'Path'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (9,32): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (16,30): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactNode'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (23,28): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactType'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (51,38): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Props'.
[0] project/web-app/node_modules/@types/react-router/lib/Router.d.ts
[0] (83,26): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-router/index.d.ts
[0] (10,33): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-router/index.d.ts
[0] (12,35): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Requireable'.
[0] project/web-app/node_modules/@types/react-redux/index.d.ts
[0] (9,32): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ComponentClass'.
[0] project/web-app/node_modules/@types/react-redux/index.d.ts
[0] (10,36): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'StatelessComponent'.
[0] project/web-app/node_modules/@types/react-redux/index.d.ts
[0] (11,24): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'ReactNode'.
[0] project/web-app/node_modules/@types/react-redux/index.d.ts
[0] (12,23): error TS2305: Module '"project/web-app/node_modules/redux/lib/index"' has no exported member 'Store'.
[0] project/web-app/node_modules/@types/react-redux/index.d.ts
[0] (13,26): error TS2305: Module '"project/web-app/node_modules/redux/lib/index"' has no exported member 'Dispatch'.
[0] project/web-app/node_modules/@types/react-redux/index.d.ts
[0] (14,31): error TS2305: Module '"project/web-app/node_modules/redux/lib/index"' has no exported member 'ActionCreator'.
[0] project/web-app/node_modules/@types/react-redux/index.d.ts
[0] (107,31): error TS2507: Type '(props: any, context: any, updater: any) => void' is not a constructor function type.
[0] project/web-app/node_modules/@types/react-helmet/index.d.ts
[0] (41,30): error TS2305: Module '"project/web-app/node_modules/react/react".export=' has no exported member 'Component'.
[0] project/web-app/node_modules/@types/react-helmet/index.d.ts
[0] (44,35): error TS2507: Type '(props: any, context: any, updater: any) => void' is not a constructor function type.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (9,10): error TS2305: Module '"project/web-app/node_modules/react/react"' has no exported member 'ReactInstance'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (9,36): error TS2305: Module '"project/web-app/node_modules/react/react"' has no exported member 'ComponentState'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (10,9): error TS2305: Module '"project/web-app/node_modules/react/react"' has no exported member 'ReactElement'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (10,23): error TS2305: Module '"project/web-app/node_modules/react/react"' has no exported member 'SFCElement'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (10,35): error TS2305: Module '"project/web-app/node_modules/react/react"' has no exported member 'CElement'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (11,10): error TS2305: Module '"project/web-app/node_modules/react/react"' has no exported member 'DOMAttributes'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (11,25): error TS2305: Module '"project/web-app/node_modules/react/react"' has no exported member 'DOMElement'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (25,34): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (32,33): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (32,82): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (43,26): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (47,63): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (48,26): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (53,26): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (58,26): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (61,33): error TS2304: Cannot find name 'Component'.
[0] project/web-app/node_modules/@types/react-dom/index.d.ts
[0] (61,82): error TS2304: Cannot find name 'Component'.
コンポーネントのサンプルを教えていただけますか? – goenning
質問に追加しました。 – Peter
'tsc'はエラーなしでコンパイルされますか?私はすべてをそのままコピーし、 'tsc'を走らせました。歴史についての誤りを得ました。 '@ types/history'を追加しました。そして、' tsc'はOKです。 – goenning