1

i ran into error TS2565: Property ‘defaultProps’ is used before being assigned while “npm run build”

OS: WSL2 Ubuntu 18.04 LTS

Redash: v9.0.0 beta ( git clone https://github.com/getredash/redash.git )

what i installed before:
node: 14.17.2
npm: 6.14.13
typeScript: 4.3.5 // sudo npm install -g typescript
Python: 3.6.9
node-gyp: 8.1.0

Got errors at npm run build

src/components/ColorPicker/Input.tsx:47:38 - error TS2565: Property 'defaultProps' is used before being assigned.

47 type Props = OwnProps & typeof Input.defaultProps;
```src/components/ColorPicker/Input.tsx:47:38 - error TS2565: Property 'defaultProps' is used before being assigned.

47 type Props = OwnProps & typeof Input.defaultProps;

Actually, I already solved this error by moving the statement of the part where Input.defaultProps is declared (line 91) before the part where it is used(line 46).

Before i fix

# used in line 47
type Props = OwnProps & typeof Input.defaultProps;

...

# declared in line 91
Input.defaultProps = {
  color: "#FFFFFF",
  presetColors: null,
  presetColumns: 8,
  onChange: () => {},
  onPressEnter: () => {},
};

After i fix

# declared in line 46
Input.defaultProps = {
  color: "#FFFFFF",
  presetColors: null,
  presetColumns: 8,
  onChange: () => {},
  onPressEnter: () => {},
};

# used in line 53
type Props = OwnProps & typeof Input.defaultProps;

...

As you can see it is a simple problem that can be solved by simply changing the declaring statement to be placed before the using statement.

Label.tsx, Swatch.tsx, index.tsx, JsonViewInteractive.tsx, ContextHelp.tsx, Section.tsx, Switch.tsx, createTabbedEditor.tsx …
about 22 files have same error
i want to know why this error occur and how can i fix this error more easily without changing each statement

Please suggest.

Thank you!

2 Likes
2

The short answer is there’s no way to do this without changing each statement.

Slightly longer answer is that we intend to refactor this after the V10 release so these will be cleaned up at that time.

FYI we closed the issue you opened on our github repo for this same subject. This forum is the place for such conversations. GH is only for planned work and bug reports.

1 Like
3

Thank you for your reply.
and
This is my first time trying to ask a question, so I misunderstood and posted an inappropriate question on github. sorry about that.

1 Like
4

To help your team refactor this issue, i have gathered the path of the file that caused this issue.
and i also included repositioning of the statements to fix the error.

redash/viz-lib/src/components/ColorPicker/Input.tsx Line 91~97 -> 46~52
redash/viz-lib/src/components/ColorPicker/Label.tsx 30~34 -> 16~20
redash/viz-lib/src/components/ColorPicker/Swatch.tsx 39~45 -> 15~21
redash/viz-lib/src/components/ColorPicker/index.tsx 158~169 -> 47~58
redash/viz-lib/src/components/ErrorBoundary.tsx 28~30 -> 21~23
redash/viz-lib/src/components/TextAlignmentSelect/index.tsx 45~47 -> 16~18
redash/viz-lib/src/components/json-view-interactive/JsonViewInteractive.tsx 108~112 -> 97~100
redash/viz-lib/src/components/sortable/index.tsx: 92~97 -> 23~28
redash/viz-lib/src/components/visualizations/editor/ContextHelp.tsx: 23~26 -> 12~15
redash/viz-lib/src/components/visualizations/editor/Section.tsx: 26~29 -> 10~13
redash/viz-lib/src/components/visualizations/editor/Section.tsx: 45~48 -> 33~36
redash/viz-lib/src/components/visualizations/editor/Switch.tsx: 40~44 -> 12~16
redash/viz-lib/src/components/visualizations/editor/createTabbedEditor.tsx: - 49~51 -> 24~26
redash/viz-lib/src/components/visualizations/editor/withControlLabel.tsx: 52~57 -> 16~21
redash/viz-lib/src/visualizations/chart/Editor/AxisSettings.tsx: 122~125 -> 28~31
redash/viz-lib/src/visualizations/chart/Editor/ChartTypeSelect.tsx: 52~54 -> 20~22
redash/viz-lib/src/visualizations/chart/Editor/ColumnMappingSelect.tsx: 60~65 -> 26~31
redash/viz-lib/src/visualizations/choropleth/Renderer/Legend.tsx: 29~32 -> 12~15
redash/viz-lib/src/visualizations/cohort/Cornelius.tsx: 234~237 -> 195~198
redash/viz-lib/src/visualizations/funnel/Renderer/FunnelBar.tsx: 25~31 -> 13~19
redash/viz-lib/src/visualizations/table/Editor/ColumnEditor.tsx: 98~100 -> 19~21
redash/viz-lib/src/visualizations/table/Renderer.tsx: 79~81 -> 60~62
redash/viz-lib/src/visualizations/choropleth/Editor/FormatSettings.tsx: 53~55 -> 22~24

// total count : 23

Additionally, the following packages were needed to fix the remaining errors of the npm run build command.

npm i --save-dev @types/debug
npm i --save-dev @types/enzyme
npm i --save-dev @types/jest
npm i --save-dev @types/plotly.js
npm i --save-dev @types/d3
npm i --save-dev @types/d3-cloud
npm i --save-dev @types/chroma-js
npm i --save-dev @types/numeral
npm i --save-dev @types/dompurify
npm i --save-dev @types/leaflet

I would be very grateful if your team could fix this problem as well.

Thank you again !

1 Like
5

Thank you! This is super helpful.

1 Like