I am having weird issues with "#sveltejs/kit": "^1.5.0" but not 1.0.0. Is there any way to tell what might be causing these? - sveltekit

I have a SvelteKit app with package.json showing "#sveltejs/kit": "^1.0.0" and it uses netlify functions to interface with mongodb and everything works fine.
I then installed, in another folder, npm create svelte#latest app and it shows "#sveltejs/kit": "^1.5.0". Everything else the same. Copied over src/static/netlify folders, installed Netlify adapter, set up netlify.toml file, .env file. Installed same version dependencies.
Under 1.5, I get several weird problems like it wont update a record or it has an issue with a {#each loop or duplicate keys. Not just one issue. Several. I change package.json entry to "#sveltejs/kit": "^1.0.0" and npm i and all the problems disappear so its definitely 1.5. I updated Node. No difference. I updated axios and mongodb and same issue.
Is there any way to find out what changes took place from 1.0 to 1.5 to try to figure this out? I would like to use the latest SvelteKit version but can't with these errors.

Related

How do I update (and keep it up to date) a old react.js project?

I have an old react project I am trying to get back into. Its been a few months since and I know there is updates for it. I tried to update them as I read on the internet how, but now my project isn't working. Some of the dependencies are out of date, it says there are vulnerabilities. Is there a way to fix it? and Is there a easy way to check other than going to each dependency? Is there a way to automate it so I dont have to remember? Any tips on how to manage a react project would be great as I am still a student and learning. Thanks
I tried to update the version in my package.json files. I also tried to delete my node_modules folder after everything broke. It broke it worse.
Unfortunately, the best way to handle dependencies is to upgrade them one-by-one, fixing problems as you go. I would start over by removing your node_modules, then reinstall your old node_modules using your lock file:
npm
npm ci
yarn
yarn install --frozen-lockfile
This way your old dependencies are installed as they were. Your app should be in a working state. Now go through your dependencies from the top-down to uninstall then reinstall each one. This allows you to fix any issues as you go, instead of trying to upgrade all packages at once and drowning in errors.
There's no automated way to handle breaking changes in external libraries.

Typescript Deployment issues (no issues local deployment)

I am working on a typescript website that is hosted on AWS amplify through a Github repo and I have been having intermittent issues deploying the site. Normally, the site builds properly and without major issues/impediments, but occasionally, the site will fail on the frontend portion of the build.
The primary error that it gives is:
2021-09-24T02:11:16.620Z [WARNING]: There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.
The react-scripts package provided by Create React App requires a dependency:
"babel-loader": "8.1.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of babel-loader was detected higher up in the tree:
/codebuild/output/--/--/--/node_modules/babel-loader (version: 8.2.2)
Manually installing incompatible versions is known to cause hard-to-debug issues.
It goes on to detail some steps to take in order to remedy the issue, which I have tried unsuccessfully a number of times (delete locks, node module folder, remove babel-loader from package.json) I also tried adding SKIP_PREFLIGHT_CHECK=true to a .env file. Doing this resolved that error, but brought up another error as detailed here:
2021-09-24T02:07:11.394Z [INFO]: ./node_modules/#usedapp/core/node_modules/ethers/lib.esm/utils.js 30:0-32:73
Attempted import error: 'TransactionTypes' is not exported from '#ethersproject/transactions'.
Again, the compilation works on my personal machine, and only presents (intermittent) issues upon attempting to build the same Github repo on Amazon Amplify
Please let me know if you have any thoughts or suggestions!
-Snips
Looks like the lib you are using didn't export something you need, if you control the lib you should export it.
Make sure you set "isolatedModules": true in your tsconfig.json

Updating create-react-app app, but cannot find react-scripts in package.json

The title says it all.
To update my app, which was made with create-react-app, I have to update react-scripts. But, I cannot find this in my package.json. I've even tried installing it manually even though it was not there in the first place and should have been. No luck. Any ideas?
can you upload s screenshot what is the message they show you once you run it ?

npm start in React app opens different url unpredictably

Tried to run npm start on a project I hadn't looked at in a couple weeks and when I did it opens up localhost:3000/myname/partofmyprojectname instead of just localhost:3000/
When I go to localhost:3000/ there's an error in my terminal
Really confusing because it worked last time I tried it and I didn't change anything I don't think.
As I was making this question I found the solution from this post:
In my package.json, "homepage"'s value was the path to the readme in the github repo: "https://github.com/myname/my-app-frontend#readme" (don't know how that happened). I just changed that to '/'.
I'm thinking maybe my version of react-scripts updated and npm start was deferring to the homepage key in the package.json but not totally sure.

React app is failing to compile, it appears typescript not being transpiled to JS?

I am working on a react app with a couple of colleagues, and after the latest pull I am no longer able to compile the app, but my colleagues are not having any issues.
On my end the app fails to compile because some #material-ui components are displayed as missing in the node_modules/#material-ui directory. However, when I search the folder, I see the files there, they are just shown in typescript format instead of js. However, when comparing my working directory with a colleague's it appears there are also files completely missing on my end that exists on theirs.
For example, when the app fails to compile I see this:
Failed to Compile
./node_modules/#material-ui/core/TextField/TextField.js
Module not found: Can't resolve '../FilledInput' in
'..../node_modules/#material-ui/core/TextField'
When I search this folder, the file is there but labelled 'FilledInput.d.ts'.
Has anyone encountered something like this? I have recompiled the app, and deleted the branch and recloned from remote but the issue remains.
Thanks
Have you tried removing node_modules and installing dependencies again?
Does npm install give any peer dependency warnings? Does this help?
npm i #material-ui/core --save

Resources