Typescript: Types of property 'data' are incompatible












0














everyone. I'm over 4 days trying to solve the problem, but with no results so, decided to ask for help.



I have copy of the one year project (it's not mine, required to finish it), which build without any errors, but when I'm getting sources from svn and run




npm i




Over the project I got errors: Types of property 'data' are incompatible.
I know for sure the reason is somewhere inside node_modules, but can't fix it.



I've already tried to generate package.json from working copy by npm shrinkwrap, use npm-collect, manually installing of all required packages. Also try to add typeRoots to the tsconfig.json - nothing.



First component



const renderContent = (
widget: IDashboardWidget,
data: IDashboardWidgetData | INodeInfoData,
) => {
...
const {type: type, displayOptions, thresholds = , id} = widget;
{
console.log(data);
return <Chart id={id} displayOptions={displayOptions} type={type} data={data} thresholds={thresholds}/>;
}
...
};

export default renderContent;


Interface that used props for Chart from the second component



interface IComponetProps {
id: string;
type: WidgetType;
thresholds?: Array<{
value: number;
severity: string;
}>;
displayOptions: IDashboardWidgetDisplayOptions,
data: object;
}


Error



    Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<Pick<IChartProps, "data" | "locatio...'.
Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'Readonly<Pick<Pick<IChartProps, "data" | "location" | "history" | "match" | "staticContext" | "id...'.
Types of property 'data' are incompatible.
Type 'INodeInfoData | { name: string; lat?: string | undefined; lon?: string | undefined; status?: stri...' is not assignable to type 'object'.
Type 'INodeInfoData' is not assignable to type 'object'.
Property 'push' is missing in type 'INodeInfoData'.


devDependencies:



"devDependencies": {
"@fortawesome/fontawesome": "^1.1.8",
"@types/classnames": "^2.2.3",
"@types/cytoscape": "^3.1.9",
"@types/file-saver": "^1.3.0",
"@types/globalize": "0.0.32",
"@types/highcharts": "^5.0.22",
"@types/jest": "^22.2.3",
"@types/jwt-decode": "^2.2.1",
"@types/lodash": "^4.14.109",
"@types/node": "^9.6.18",
"@types/ramda": "^0.25.29",
"@types/react": "^16.3.14",
"@types/react-click-outside": "^3.0.1",
"@types/react-custom-scrollbars": "^4.0.3",
"@types/react-dates": "^16.0.6",
"@types/react-dom": "^16.0.5",
"@types/react-grid-layout": "^0.16.4",
"@types/react-redux": "^5.0.20",
"@types/react-router-dom": "^4.2.6",
"@types/react-router-redux": "^5.0.14",
"@types/react-sortable-hoc": "^0.6.3",
"@types/react-tabs": "^1.0.4",
"@types/react-toggle": "^4.0.1",
"@types/react-widgets": "^4.1.2",
"@types/recompose": "^0.26.1",
"@types/redux-form": "^7.2.5",
"@types/redux-logger": "^3.0.6",
"@types/socket.io-client": "^1.4.32",
"@types/uuid": "^3.4.3",
"globalize-webpack-plugin": "^2.1.0",
"node-sass": "^4.9.0",
"prettier": "^1.12.1",
"redux-devtools-extension": "^2.13.2",
"redux-logger": "^3.0.6",
"sass-loader": "^7.0.1",
"tslint-config-prettier": "^1.13.0",
"typescript": "2.8.3",
"webpack-bundle-analyzer": "^2.13.1"


},



React:



"react": "^16.3.2"


I'm almost sure, problem in dependencies, but I can be wrong. Will be grateful for any advice and help.










share|improve this question





























    0














    everyone. I'm over 4 days trying to solve the problem, but with no results so, decided to ask for help.



    I have copy of the one year project (it's not mine, required to finish it), which build without any errors, but when I'm getting sources from svn and run




    npm i




    Over the project I got errors: Types of property 'data' are incompatible.
    I know for sure the reason is somewhere inside node_modules, but can't fix it.



    I've already tried to generate package.json from working copy by npm shrinkwrap, use npm-collect, manually installing of all required packages. Also try to add typeRoots to the tsconfig.json - nothing.



    First component



    const renderContent = (
    widget: IDashboardWidget,
    data: IDashboardWidgetData | INodeInfoData,
    ) => {
    ...
    const {type: type, displayOptions, thresholds = , id} = widget;
    {
    console.log(data);
    return <Chart id={id} displayOptions={displayOptions} type={type} data={data} thresholds={thresholds}/>;
    }
    ...
    };

    export default renderContent;


    Interface that used props for Chart from the second component



    interface IComponetProps {
    id: string;
    type: WidgetType;
    thresholds?: Array<{
    value: number;
    severity: string;
    }>;
    displayOptions: IDashboardWidgetDisplayOptions,
    data: object;
    }


    Error



        Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<Pick<IChartProps, "data" | "locatio...'.
    Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'Readonly<Pick<Pick<IChartProps, "data" | "location" | "history" | "match" | "staticContext" | "id...'.
    Types of property 'data' are incompatible.
    Type 'INodeInfoData | { name: string; lat?: string | undefined; lon?: string | undefined; status?: stri...' is not assignable to type 'object'.
    Type 'INodeInfoData' is not assignable to type 'object'.
    Property 'push' is missing in type 'INodeInfoData'.


    devDependencies:



    "devDependencies": {
    "@fortawesome/fontawesome": "^1.1.8",
    "@types/classnames": "^2.2.3",
    "@types/cytoscape": "^3.1.9",
    "@types/file-saver": "^1.3.0",
    "@types/globalize": "0.0.32",
    "@types/highcharts": "^5.0.22",
    "@types/jest": "^22.2.3",
    "@types/jwt-decode": "^2.2.1",
    "@types/lodash": "^4.14.109",
    "@types/node": "^9.6.18",
    "@types/ramda": "^0.25.29",
    "@types/react": "^16.3.14",
    "@types/react-click-outside": "^3.0.1",
    "@types/react-custom-scrollbars": "^4.0.3",
    "@types/react-dates": "^16.0.6",
    "@types/react-dom": "^16.0.5",
    "@types/react-grid-layout": "^0.16.4",
    "@types/react-redux": "^5.0.20",
    "@types/react-router-dom": "^4.2.6",
    "@types/react-router-redux": "^5.0.14",
    "@types/react-sortable-hoc": "^0.6.3",
    "@types/react-tabs": "^1.0.4",
    "@types/react-toggle": "^4.0.1",
    "@types/react-widgets": "^4.1.2",
    "@types/recompose": "^0.26.1",
    "@types/redux-form": "^7.2.5",
    "@types/redux-logger": "^3.0.6",
    "@types/socket.io-client": "^1.4.32",
    "@types/uuid": "^3.4.3",
    "globalize-webpack-plugin": "^2.1.0",
    "node-sass": "^4.9.0",
    "prettier": "^1.12.1",
    "redux-devtools-extension": "^2.13.2",
    "redux-logger": "^3.0.6",
    "sass-loader": "^7.0.1",
    "tslint-config-prettier": "^1.13.0",
    "typescript": "2.8.3",
    "webpack-bundle-analyzer": "^2.13.1"


    },



    React:



    "react": "^16.3.2"


    I'm almost sure, problem in dependencies, but I can be wrong. Will be grateful for any advice and help.










    share|improve this question



























      0












      0








      0


      1





      everyone. I'm over 4 days trying to solve the problem, but with no results so, decided to ask for help.



      I have copy of the one year project (it's not mine, required to finish it), which build without any errors, but when I'm getting sources from svn and run




      npm i




      Over the project I got errors: Types of property 'data' are incompatible.
      I know for sure the reason is somewhere inside node_modules, but can't fix it.



      I've already tried to generate package.json from working copy by npm shrinkwrap, use npm-collect, manually installing of all required packages. Also try to add typeRoots to the tsconfig.json - nothing.



      First component



      const renderContent = (
      widget: IDashboardWidget,
      data: IDashboardWidgetData | INodeInfoData,
      ) => {
      ...
      const {type: type, displayOptions, thresholds = , id} = widget;
      {
      console.log(data);
      return <Chart id={id} displayOptions={displayOptions} type={type} data={data} thresholds={thresholds}/>;
      }
      ...
      };

      export default renderContent;


      Interface that used props for Chart from the second component



      interface IComponetProps {
      id: string;
      type: WidgetType;
      thresholds?: Array<{
      value: number;
      severity: string;
      }>;
      displayOptions: IDashboardWidgetDisplayOptions,
      data: object;
      }


      Error



          Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<Pick<IChartProps, "data" | "locatio...'.
      Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'Readonly<Pick<Pick<IChartProps, "data" | "location" | "history" | "match" | "staticContext" | "id...'.
      Types of property 'data' are incompatible.
      Type 'INodeInfoData | { name: string; lat?: string | undefined; lon?: string | undefined; status?: stri...' is not assignable to type 'object'.
      Type 'INodeInfoData' is not assignable to type 'object'.
      Property 'push' is missing in type 'INodeInfoData'.


      devDependencies:



      "devDependencies": {
      "@fortawesome/fontawesome": "^1.1.8",
      "@types/classnames": "^2.2.3",
      "@types/cytoscape": "^3.1.9",
      "@types/file-saver": "^1.3.0",
      "@types/globalize": "0.0.32",
      "@types/highcharts": "^5.0.22",
      "@types/jest": "^22.2.3",
      "@types/jwt-decode": "^2.2.1",
      "@types/lodash": "^4.14.109",
      "@types/node": "^9.6.18",
      "@types/ramda": "^0.25.29",
      "@types/react": "^16.3.14",
      "@types/react-click-outside": "^3.0.1",
      "@types/react-custom-scrollbars": "^4.0.3",
      "@types/react-dates": "^16.0.6",
      "@types/react-dom": "^16.0.5",
      "@types/react-grid-layout": "^0.16.4",
      "@types/react-redux": "^5.0.20",
      "@types/react-router-dom": "^4.2.6",
      "@types/react-router-redux": "^5.0.14",
      "@types/react-sortable-hoc": "^0.6.3",
      "@types/react-tabs": "^1.0.4",
      "@types/react-toggle": "^4.0.1",
      "@types/react-widgets": "^4.1.2",
      "@types/recompose": "^0.26.1",
      "@types/redux-form": "^7.2.5",
      "@types/redux-logger": "^3.0.6",
      "@types/socket.io-client": "^1.4.32",
      "@types/uuid": "^3.4.3",
      "globalize-webpack-plugin": "^2.1.0",
      "node-sass": "^4.9.0",
      "prettier": "^1.12.1",
      "redux-devtools-extension": "^2.13.2",
      "redux-logger": "^3.0.6",
      "sass-loader": "^7.0.1",
      "tslint-config-prettier": "^1.13.0",
      "typescript": "2.8.3",
      "webpack-bundle-analyzer": "^2.13.1"


      },



      React:



      "react": "^16.3.2"


      I'm almost sure, problem in dependencies, but I can be wrong. Will be grateful for any advice and help.










      share|improve this question















      everyone. I'm over 4 days trying to solve the problem, but with no results so, decided to ask for help.



      I have copy of the one year project (it's not mine, required to finish it), which build without any errors, but when I'm getting sources from svn and run




      npm i




      Over the project I got errors: Types of property 'data' are incompatible.
      I know for sure the reason is somewhere inside node_modules, but can't fix it.



      I've already tried to generate package.json from working copy by npm shrinkwrap, use npm-collect, manually installing of all required packages. Also try to add typeRoots to the tsconfig.json - nothing.



      First component



      const renderContent = (
      widget: IDashboardWidget,
      data: IDashboardWidgetData | INodeInfoData,
      ) => {
      ...
      const {type: type, displayOptions, thresholds = , id} = widget;
      {
      console.log(data);
      return <Chart id={id} displayOptions={displayOptions} type={type} data={data} thresholds={thresholds}/>;
      }
      ...
      };

      export default renderContent;


      Interface that used props for Chart from the second component



      interface IComponetProps {
      id: string;
      type: WidgetType;
      thresholds?: Array<{
      value: number;
      severity: string;
      }>;
      displayOptions: IDashboardWidgetDisplayOptions,
      data: object;
      }


      Error



          Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<Pick<Pick<IChartProps, "data" | "locatio...'.
      Type '{ id: string; displayOptions: IDashboardWidgetDisplayOptions; type: WidgetType.line | WidgetType....' is not assignable to type 'Readonly<Pick<Pick<IChartProps, "data" | "location" | "history" | "match" | "staticContext" | "id...'.
      Types of property 'data' are incompatible.
      Type 'INodeInfoData | { name: string; lat?: string | undefined; lon?: string | undefined; status?: stri...' is not assignable to type 'object'.
      Type 'INodeInfoData' is not assignable to type 'object'.
      Property 'push' is missing in type 'INodeInfoData'.


      devDependencies:



      "devDependencies": {
      "@fortawesome/fontawesome": "^1.1.8",
      "@types/classnames": "^2.2.3",
      "@types/cytoscape": "^3.1.9",
      "@types/file-saver": "^1.3.0",
      "@types/globalize": "0.0.32",
      "@types/highcharts": "^5.0.22",
      "@types/jest": "^22.2.3",
      "@types/jwt-decode": "^2.2.1",
      "@types/lodash": "^4.14.109",
      "@types/node": "^9.6.18",
      "@types/ramda": "^0.25.29",
      "@types/react": "^16.3.14",
      "@types/react-click-outside": "^3.0.1",
      "@types/react-custom-scrollbars": "^4.0.3",
      "@types/react-dates": "^16.0.6",
      "@types/react-dom": "^16.0.5",
      "@types/react-grid-layout": "^0.16.4",
      "@types/react-redux": "^5.0.20",
      "@types/react-router-dom": "^4.2.6",
      "@types/react-router-redux": "^5.0.14",
      "@types/react-sortable-hoc": "^0.6.3",
      "@types/react-tabs": "^1.0.4",
      "@types/react-toggle": "^4.0.1",
      "@types/react-widgets": "^4.1.2",
      "@types/recompose": "^0.26.1",
      "@types/redux-form": "^7.2.5",
      "@types/redux-logger": "^3.0.6",
      "@types/socket.io-client": "^1.4.32",
      "@types/uuid": "^3.4.3",
      "globalize-webpack-plugin": "^2.1.0",
      "node-sass": "^4.9.0",
      "prettier": "^1.12.1",
      "redux-devtools-extension": "^2.13.2",
      "redux-logger": "^3.0.6",
      "sass-loader": "^7.0.1",
      "tslint-config-prettier": "^1.13.0",
      "typescript": "2.8.3",
      "webpack-bundle-analyzer": "^2.13.1"


      },



      React:



      "react": "^16.3.2"


      I'm almost sure, problem in dependencies, but I can be wrong. Will be grateful for any advice and help.







      reactjs typescript types dependencies






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 20 '18 at 8:55

























      asked Nov 19 '18 at 15:18









      Antatrix

      3510




      3510
























          2 Answers
          2






          active

          oldest

          votes


















          1














          Seems like INodeInfoData is not an array and cannot be passed as object. More information would be appreciated.






          share|improve this answer





















          • this code works fine with the node_modules installed about half a year ago, but if I run npm again, I got this error
            – Antatrix
            Nov 20 '18 at 8:04










          • So as i said, the problem is with INodeInfoData not beeing an array. But with your code samples i cannot provide a better answer.
            – Stramski
            Nov 20 '18 at 12:29



















          0














          Well, I stopped on react 16.3.2 and typescript 2.8.3 versions, and I still don't know which exactly package required the source code changes, but this helps:



              return <Chart id={id} displayOptions={displayOptions}  type={widgetType} 
          data={data as IDashboardWidgetData} thresholds={thresholds}/>;





          share|improve this answer





















            Your Answer






            StackExchange.ifUsing("editor", function () {
            StackExchange.using("externalEditor", function () {
            StackExchange.using("snippets", function () {
            StackExchange.snippets.init();
            });
            });
            }, "code-snippets");

            StackExchange.ready(function() {
            var channelOptions = {
            tags: "".split(" "),
            id: "1"
            };
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function() {
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled) {
            StackExchange.using("snippets", function() {
            createEditor();
            });
            }
            else {
            createEditor();
            }
            });

            function createEditor() {
            StackExchange.prepareEditor({
            heartbeatType: 'answer',
            autoActivateHeartbeat: false,
            convertImagesToLinks: true,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: 10,
            bindNavPrevention: true,
            postfix: "",
            imageUploader: {
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            },
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            });


            }
            });














            draft saved

            draft discarded


















            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53377672%2ftypescript-types-of-property-data-are-incompatible%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown

























            2 Answers
            2






            active

            oldest

            votes








            2 Answers
            2






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes









            1














            Seems like INodeInfoData is not an array and cannot be passed as object. More information would be appreciated.






            share|improve this answer





















            • this code works fine with the node_modules installed about half a year ago, but if I run npm again, I got this error
              – Antatrix
              Nov 20 '18 at 8:04










            • So as i said, the problem is with INodeInfoData not beeing an array. But with your code samples i cannot provide a better answer.
              – Stramski
              Nov 20 '18 at 12:29
















            1














            Seems like INodeInfoData is not an array and cannot be passed as object. More information would be appreciated.






            share|improve this answer





















            • this code works fine with the node_modules installed about half a year ago, but if I run npm again, I got this error
              – Antatrix
              Nov 20 '18 at 8:04










            • So as i said, the problem is with INodeInfoData not beeing an array. But with your code samples i cannot provide a better answer.
              – Stramski
              Nov 20 '18 at 12:29














            1












            1








            1






            Seems like INodeInfoData is not an array and cannot be passed as object. More information would be appreciated.






            share|improve this answer












            Seems like INodeInfoData is not an array and cannot be passed as object. More information would be appreciated.







            share|improve this answer












            share|improve this answer



            share|improve this answer










            answered Nov 19 '18 at 16:47









            Stramski

            1415




            1415












            • this code works fine with the node_modules installed about half a year ago, but if I run npm again, I got this error
              – Antatrix
              Nov 20 '18 at 8:04










            • So as i said, the problem is with INodeInfoData not beeing an array. But with your code samples i cannot provide a better answer.
              – Stramski
              Nov 20 '18 at 12:29


















            • this code works fine with the node_modules installed about half a year ago, but if I run npm again, I got this error
              – Antatrix
              Nov 20 '18 at 8:04










            • So as i said, the problem is with INodeInfoData not beeing an array. But with your code samples i cannot provide a better answer.
              – Stramski
              Nov 20 '18 at 12:29
















            this code works fine with the node_modules installed about half a year ago, but if I run npm again, I got this error
            – Antatrix
            Nov 20 '18 at 8:04




            this code works fine with the node_modules installed about half a year ago, but if I run npm again, I got this error
            – Antatrix
            Nov 20 '18 at 8:04












            So as i said, the problem is with INodeInfoData not beeing an array. But with your code samples i cannot provide a better answer.
            – Stramski
            Nov 20 '18 at 12:29




            So as i said, the problem is with INodeInfoData not beeing an array. But with your code samples i cannot provide a better answer.
            – Stramski
            Nov 20 '18 at 12:29













            0














            Well, I stopped on react 16.3.2 and typescript 2.8.3 versions, and I still don't know which exactly package required the source code changes, but this helps:



                return <Chart id={id} displayOptions={displayOptions}  type={widgetType} 
            data={data as IDashboardWidgetData} thresholds={thresholds}/>;





            share|improve this answer


























              0














              Well, I stopped on react 16.3.2 and typescript 2.8.3 versions, and I still don't know which exactly package required the source code changes, but this helps:



                  return <Chart id={id} displayOptions={displayOptions}  type={widgetType} 
              data={data as IDashboardWidgetData} thresholds={thresholds}/>;





              share|improve this answer
























                0












                0








                0






                Well, I stopped on react 16.3.2 and typescript 2.8.3 versions, and I still don't know which exactly package required the source code changes, but this helps:



                    return <Chart id={id} displayOptions={displayOptions}  type={widgetType} 
                data={data as IDashboardWidgetData} thresholds={thresholds}/>;





                share|improve this answer












                Well, I stopped on react 16.3.2 and typescript 2.8.3 versions, and I still don't know which exactly package required the source code changes, but this helps:



                    return <Chart id={id} displayOptions={displayOptions}  type={widgetType} 
                data={data as IDashboardWidgetData} thresholds={thresholds}/>;






                share|improve this answer












                share|improve this answer



                share|improve this answer










                answered Nov 20 '18 at 8:53









                Antatrix

                3510




                3510






























                    draft saved

                    draft discarded




















































                    Thanks for contributing an answer to Stack Overflow!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.





                    Some of your past answers have not been well-received, and you're in danger of being blocked from answering.


                    Please pay close attention to the following guidance:


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid



                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.


                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function () {
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53377672%2ftypescript-types-of-property-data-are-incompatible%23new-answer', 'question_page');
                    }
                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    Popular posts from this blog

                    MongoDB - Not Authorized To Execute Command

                    in spring boot 2.1 many test slices are not allowed anymore due to multiple @BootstrapWith

                    Npm cannot find a required file even through it is in the searched directory