Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

v7.0.11 - Importing RCPCHChart from npm package no longer functions #107

Closed
dmc-cambric opened this issue Sep 12, 2024 · 6 comments
Closed
Assignees
Labels
bug Something isn't working

Comments

@dmc-cambric
Copy link
Contributor

dmc-cambric commented Sep 12, 2024

Hi guys,

Have attempted an upgrade from v7.0.9 to v7.0.11 in our app, however it appears that importing the RCPCHChart react component is no longer possible. Is this potentially related to recent build changes?

Import code:

import { RCPCHChart } from "@rcpch/digital-growth-charts-react-component-library"

Generated error:

error TS7016: Could not find a declaration file for module '@rcpch/digital-growth-charts-react-component-library'. 'node_modules/@rcpch/digital-growth-charts-react-component-library/dist/index.js' implicitly has an 'any' type.

Another potential issue I've spotted is the type importing, previously these were being fetched from the build folder within the package. (see below examples)

import { RCPCHChartProps } from "@rcpch/digital-growth-charts-react-component-library/build/RCPCHChart/RCPCHChart.types"
import { ClientMeasurementObject } from "@rcpch/digital-growth-charts-react-component-library/build/interfaces/ClientMeasurementObject";

I've had to update these to instead fetch from the src folder for the build to work correctly, i.e.

import { RCPCHChartProps } from "@rcpch/digital-growth-charts-react-component-library/src/RCPCHChart/RCPCHChart.types"
import { ClientMeasurementObject } from "@rcpch/digital-growth-charts-react-component-library/src/interfaces/ClientMeasurementObject";

Curious if this is an intentional change or if types should be getting imported differently.

Any help you can give is much appreciated!

@eatyourpeas
Copy link
Member

Ah sorry @dmc-cambric yes it is possible things got moved around when I removed the fonts and css files. I changed the build folder name to dist. That was not very helpful - I apologize. In our own client we import this way:
import { RCPCHChart } from "@rcpch/digital-growth-charts-react-component-library";
and
import { ClientMeasurementObject } from "@rcpch/digital-growth-charts-react-component-library/dist/types"

This I guess is a breaking change which it was not meant to be so I can put it back the way it was. In the meantime changing build to dist should work

@dmc-cambric
Copy link
Contributor Author

Hi Simon, yeah the import for the RCPCHChart there is the same one that we use:

import { RCPCHChart } from "@rcpch/digital-growth-charts-react-component-library"

However I think there are some differences in our implementation, we're using the import within a typescript file, and it seems the typing is broken in some areas with the new npm package build.

v7.0.9 build folder:
src: https://www.npmjs.com/package/@rcpch/digital-growth-charts-react-component-library/v/7.0.9?activeTab=code
image

v7.0.11 dist folder
src: https://www.npmjs.com/package/@rcpch/digital-growth-charts-react-component-library?activeTab=code
image

From what I can tell, a lot of files are missing from the dist folder that were previously present in the build folder of the npm package. Most notably the index.d.ts file.

I think this omission has been caused by a setting in tsconfig.json: "declarationDir": "build" which I believe should be pointing towards 'dist' - Link to line.

@dmc-cambric
Copy link
Contributor Author

dmc-cambric commented Sep 13, 2024

Regarding importing types from the dist/types:
import { MidParentalHeightObject } from "@rcpch/digital-growth-charts-react-component-library/dist/types"

When doing the above, I get the following TS2459 error:

"@rcpch/digital-growth-charts-react-component-library/dist/types"' declares 'MidParentalHeightObject' locally, but it is not exported.

The above occurs for all the other imports as well (i.e. Measurement, ClientMeasurementObject). I'm wondering if the interfaces declared within @rcpch/digital-growth-charts-react-component-library/dist/types.d.ts should be 'export interface' instead of 'interface'?

@dmc-cambric
Copy link
Contributor Author

I'm also getting a TS2724 error when attempting to import the RCPCHChartProps:
'"@rcpch/digital-growth-charts-react-component-library/dist/types" has no exported member named 'RCPCHChartProps'

My previous import code fetched directly from the types file for the RCPCHChart, but this file is no longer present in the build folder. Should this be appearing in the dist/types file instead?

import { RCPCHChartProps } from "@rcpch/digital-growth-charts-react-component-library/build/RCPCHChart/RCPCHChart.types";

@eatyourpeas eatyourpeas self-assigned this Sep 13, 2024
@eatyourpeas eatyourpeas added the bug Something isn't working label Sep 13, 2024
@eatyourpeas
Copy link
Member

Thanks @dmc-cambric for this super helpful and detailed information. I meant to tidy the build folder in the process of stripping out the raw font files but should have thought about it a bit more clearly before refactoring things. I am sorry. I have set it all back to the way it was. Let me know here if I have missed something.

@eatyourpeas
Copy link
Member

closed with #108

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants