Closed cshuphys closed 4 months ago
Another thing I noticed that we have node-modules
files at frontend location. I notice that there are conflicting lines in the .gitignore. @ChrisDelClea maybe that is upload to the github by accident?
Lines in the .gitignore
!/streamlit_agraph/frontend/node_modules/
/streamlit_agraph/frontend/node_modules/
The error you're encountering during npm install is related to a dependency resolution conflict involving the typescript version. Specifically, your project is using typescript@4.7.4 which is conflicting with the version required by react-scripts@3.4.1, which expects typescript to be around version 3.9.10.
Step 1: Understanding the Conflict
react-scripts@3.4.1 requires a version of typescript that is less than 4.0.0, as indicated by the peer dependency requirement peerOptional typescript@"^3.2.1". However, your project has a higher version of typescript (4.7.4), which is not compatible with the required version range.
Step 2: Resolving the Dependency Conflict You have several options to resolve this issue:
Downgrade TypeScript
If your project can accommodate, consider downgrading typescript to a version compatible with react-scripts@3.4.1. This would be a version less than 4.0.0. You can install a compatible version by running:
npm install typescript@3.9.10 --save-exact
The --save-exact flag ensures that typescript is locked to version 3.9.10, which is within the expected range for react-scripts@3.4.1.
Upgrade React Scripts Another approach is to upgrade react-scripts to a version that supports typescript@4.7.4. The latest versions of react-scripts (e.g., 4.x or higher) are likely compatible with newer typescript versions. To upgrade react-scripts, run:
npm install react-scripts@latest
Use the --legacy-peer-deps Option If modifying versions is not suitable, you can instruct npm to ignore peer dependency conflicts by using the --legacy-peer-deps option when installing:
npm install --legacy-peer-deps
This tells npm to use the older dependency resolution algorithm that does not automatically exit on peer dependency conflicts. Use the --force Option As a last resort, you can use the --force flag to force npm to proceed with the installation despite conflicts:
npm install --force
Be aware that using --force can lead to unstable builds if dependencies are not actually compatible.
Step 3: Verify Installation After applying any of the above fixes, ensure to run your application or its tests to verify that all functionalities are working as expected without issues.
Final Recommendation I recommend trying the options in the order listed. Start with downgrading typescript if possible, as this keeps your project in alignment with the react-scripts version you're currently using. Upgrading react-scripts or using --legacy-peer-deps are good alternatives if downgrading typescript introduces other issues.
Thanks for the suggestions. I figured it out and update all dependencies. I also rewrote the code using the Functional hook since the code in the current repo doesn't work correctly with the library specified. Will find a time to post it and make a PR. Thanks for looking into this.
@cshuphys do you have a fork? I'm trying to make changes and can't build the frontend either
I push my version to my fork and made the pull request here https://github.com/ChrisDelClea/streamlit-agraph/pull/59
I am a bit new to the node and nodejs. While I tried to build frontend myself, I encounter following error. Would appreciate some help. Thanks!
I tried to
npm install
at the current master branch atstreamlit-agraph/streamlit_agraph/frontend
I am using npm 8.19.4 and npm is installed via nodejs 16.20.2 via asdf
Here is log of my error.
I am in the attempt to to separate functionality of DoubleClickedEvent vs the title that showed up when mouseover. Plan to add a field call link that only used for DoubleClickedEvent.