Я новичок в React. Я унаследовал код, который наследует MyTable
компонент от Antd Table . Я не хочу менять эту архитектуру.
По другим причинам я сделал полное обновление пакета, сейчас я нахожусь на Antd 3.24.0, React (-dom) 16.10.2, Typescript 3.6.4. Ранее (Antd 2.10.0, React 15.5.3, Typescript 2.2.1) 2-я строка (в файле tsx
) работала просто отлично
import { Table } from "antd";
class MyTable extends Table<Interfaces.SummaryViewEntry> { }
Теперь, после обновления до последней версии пакета,webpack отказывается переноситься со следующей ошибкой:
TS2508 (TS) Ни у одного базового конструктора не указано число аргументов типа.
На всякий случай, если вам интересно: Ininterfaces.ts
, мы определили что-то похожее на следующее:
export interface SummaryViewEntry {
LedgerName: string,
Value: number,
}
Соответствующий файл декларации node_modules\antd\lib\table\Table.d.ts
читает
import * as React from 'react';
import { TableProps } from './interface';
declare const _default: React.ComponentClass<Pick<TableProps<any>, "loading" | "footer" | "style" | "title" | "scroll" | "size" | "children" | "className" | "prefixCls" | "locale" | "getPopupContainer" | "onChange" | "dataSource" | "expandIcon" | "tableLayout" | "columns" | "bordered" | "bodyStyle" | "pagination" | "rowKey" | "dropdownPrefixCls" | "rowSelection" | "components" | "rowClassName" | "expandedRowRender" | "defaultExpandAllRows" | "defaultExpandedRowKeys" | "expandedRowKeys" | "expandIconAsCell" | "expandIconColumnIndex" | "expandRowByClick" | "onExpandedRowsChange" | "onExpand" | "indentSize" | "onRowClick" | "onRow" | "onHeaderRow" | "useFixedHeader" | "showHeader" | "childrenColumnName" | "sortDirections">, any>;
export default _default;
Любой совет приветствуется.
РЕДАКТИРОВАТЬ: Справочная информация
Webpack.config после обновления
var path = require('path');
const APP_DIR = path.resolve(__dirname, 'src/');
module.exports = {
entry: `${APP_DIR}/index.tsx`,
target: 'node',
resolve: {
extensions: ['.ts', '.tsx', '.js']
},
module: {
rules: [
{
test: /\.tsx?$/, use: [
{
loader: 'babel-loader',
options: {
presets: [['@babel/env', {
"targets": { "browsers": ["ie >= 11"] }
}]]
}
},
"ts-loader"]
},
{ test: /\.css$/, loader: 'css-loader' },
{ test: /\.js$/, loader: 'source-map-loader' },
{ test: /\.less$/, loader: 'css-loader!less-loader' }
]
},
devtool: "source-map",
output: {
filename: 'bundle.js',
path: path.resolve(__dirname, 'dist')
}
};
Webpack.config до обновления
var ExtractTextPlugin = require("extract-text-webpack-plugin");
module.exports = {
entry: {
"bundle": ["babel-polyfill", "whatwg-fetch", "./src/index.tsx"]
},
output: {
filename: "[name].js",
path: __dirname + "/dist"
},
devtool: "source-map",
resolve: {
extensions: [".ts", ".tsx", ".js", ".json"]
},
module: {
loaders: [
{ test: /\.tsx?$/, use: [
{
loader: 'babel-loader',
options: {
presets: [[
'env',
{
"targets": {
"browsers": ["ie >= 11"]
}
}
]]
}
},"ts-loader"] },
{ test: /\.js$/, loader: "source-map-loader" },
{ test: /\.less$/, loader: ExtractTextPlugin.extract("css-loader!less-loader") }
]
},
plugins: [
new ExtractTextPlugin("[name].css")
]
};
Ссылки