How to install all packages from Gatsby V3 - npm

I currently have Gatsby installed on version 4, but I wanted to "downgrade" it to version 3, and all dependencies to be compatible with version 3.
Is there any method to "downgrade" everything to the most up-to-date V3 version?
My package.json
"dependencies": {
"#babel/plugin-transform-typescript": "^7.16.1",
"#styled-icons/boxicons-regular": "^10.38.0",
"#types/node": "^16.11.7",
"#types/react": "^17.0.34",
"#types/react-helmet": "^6.1.4",
"gatsby": "^4.1.1",
"gatsby-plugin-gatsby-cloud": "^4.1.0",
"gatsby-plugin-image": "^2.1.2",
"gatsby-plugin-manifest": "^4.1.0",
"gatsby-plugin-offline": "^5.1.0",
"gatsby-plugin-react-helmet": "^5.1.0",
"gatsby-plugin-sharp": "^4.1.3",
"gatsby-source-filesystem": "^4.1.2",
"gatsby-transformer-sharp": "^4.1.0",
"plop": "^2.7.6",
"prop-types": "^15.7.2",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-helmet": "^6.1.0",
"react-icons": "^4.3.1",
"react-markdown": "^7.1.0",
"rehype-raw": "^6.1.0",
"styled-components": "^5.3.3",
"styled-media-query": "^2.1.2",
"swiper": "^7.2.0",
"tslint": "^6.1.3",
"typescript": "^4.4.4"
},
"devDependencies": {
"#babel/core": "^7.16.0",
"#react-icons/all-files": "^4.1.0",
"#storybook/addon-actions": "^6.3.12",
"#storybook/addon-essentials": "^6.3.12",
"#storybook/addon-links": "^6.3.12",
"#storybook/builder-webpack5": "^6.3.12",
"#storybook/manager-webpack5": "^6.3.12",
"#storybook/react": "^6.3.12",
"#types/react-dom": "^17.0.11",
"#types/styled-components": "^5.1.15",
"#types/swiper": "^5.4.3",
"#typescript-eslint/eslint-plugin": "^5.3.1",
"#typescript-eslint/parser": "^5.3.1",
"babel-loader": "^8.2.3",
"babel-plugin-styled-components": "^1.13.3",
"chromatic": "^6.0.6",
"eslint": "^8.2.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-react": "^7.27.0",
"eslint-plugin-react-hooks": "^4.3.0",
"gatsby-plugin-scss-typescript": "^5.1.0",
"gatsby-plugin-styled-components": "^5.1.0",
"gatsby-plugin-typescript-scss-modules": "^1.0.7",
"prettier": "^2.4.1",
"storybook-addon-gatsby": "^0.0.2"
},

There's no magic command to downgrade automatically Gatsby version and all related dependencies. Basically, you need uninstall and reinstall Gatsby to your desired version:
If you need to reset your gatsby-cli version:
npm uninstall -g gatsby-cli
npm install -g gatsby-cli#latest
After that:
npm install gatsby#3.14
Where 3.14 is your desired version (according to the releases notes it should be 3.14).
Then, you will need to run:
npm outdated
To fix your dependency versions.
You'll need to remove the node_modules and the package-lock.json before installing and auditing the packages to avoid locked dependencies and odd behaviors.

Related

The experience you requested uses Expo SDK v(null), but this copy of Expo Client requires at least v35.0.0

I decided to return to an Expo app I was developing last year and was using expo-sdk:v33.0.0 and it was working.
I tried to use a solution of Squirrl from similar question, but still no luck. Tried removing node_modules and yarn_install. Here's my package.json:
enter
"dependencies": {
"#react-native-community/masked-view": "^0.1.7",
"#react-navigation/material-bottom-tabs": "^5.1.1",
"#react-navigation/material-top-tabs": "^5.1.1",
"#react-navigation/native": "^5.0.9",
"#react-navigation/stack": "^5.2.3",
"axios": "^0.18.1",
"date-fns": "^1.29.0",
"dotenv": "^8.2.0",
"expo": "^33.0.0",
"expo-font": "~5.0.1",
"lodash": "^4.17.15",
"native-base": "^2.13.1",
"react": "16.8.3",
"react-native": "https://github.com/expo/react-native/archive/sdk-33.0.0.tar.gz",
"react-native-gesture-handler": "~1.2.1",
"react-native-modal": "^11.5.4",
"react-native-paper": "^3.6.0",
"react-native-platform-touchable": "^1.1.1",
"react-native-reanimated": "1.0.1",
"react-native-safe-area-context": "^0.7.3",
"react-native-safe-area-view": "^1.0.0",
"react-native-status-bar-height": "^2.1.0",
"react-native-tab-view": "^2.13.0",
"react-native-vector-icons": "^5.0.0",
"react-redux": "^5.1.0",
"redux": "^4.0.1",
"redux-axios-middleware": "^4.0.0",
"redux-persist": "^5.10.0",
"save": "^2.4.0",
"victory-native": "^30.6.0"
"devDependencies": {
"babel-preset-expo": "^5.0.0",
"nodemon": "^2.0.2",
"react-native-dotenv": "^0.2.0"
The app was working with these dependencies that time.
1st issue is that error says Expo SDK v(null). But version is specified in both package.json and app.json.
2nd issue is error says Expo client requires v35.0.0. How can i run the app without upgrading sdk from v33 to v35
This is what worked for me.
Run npm i -g expo-cli (You may have to use sudo if on a Mac. I did.) then run expo upgrade
Follow the prompts and it should work.

undefined is not an object (evaluating 'viewConfig.Manager')

Im trying to upgrade expo sdk from version 33 to 34 and getting undefined is not an object (evaluating 'viewConfig.Manager') inside react-native package
package.json
"date-fns": "^2.0.1",
"eslint-plugin-react-hooks": "^1.7.0",
"expo": "^34.0.1",
"expo-analytics-amplitude": "~5.0.1",
"expo-asset": "^5.0.1",
"expo-constants": "^6.0.0",
"expo-font": "~5.0.1",
"expo-intent-launcher": "^6.0.0",
"expo-keep-awake": "~5.0.1",
"expo-linear-gradient": "~5.0.1",
"expo-localization": "~5.0.1",
"expo-location": "^5.0.1",
"expo-permissions": "^6.0.0",
"expo-yarn-workspaces": "^1.1.0",
"i18n-js": "3.2.2",
"pomeranian-durations": "^1.8.1",
"prop-types": "15.7.2",
"react": "16.8.3",
"react-native": "https://github.com/expo/react-native/archive/sdk-34.0.0.tar.gz",
"react-native-app-intro-slider": "^3.0.0",
"react-native-gifted-chat": "0.9.0",
"react-native-keyboard-spacer": "^0.4.1",
"react-navigation": "^3.9.1",
"react-redux": "6.0.1",
"redux": "^4.0.1",
"redux-devtools-extension": "2.13.8",
"redux-logger": "3.0.6",
"redux-optimist": "^1.0.0",
"redux-sentry-middleware": "^0.1.1",
"redux-persist": "6.0.0",
"redux-thunk": "2.3.0",
"sentry-expo": "2.0.0",
"styled-components": "^4.2.0",
"synced-interval": "^0.2.0"
I was struggling with the same issue for the last two hours.
In my case there were some outdated libraries (including one I authored) using the old version of react-native which somehow causes this error.
Try running:
npm outdated
And then install new versions of outdated libraries listed using expo-cli one by one.
Hope this helps :)

Does publishing to NPM add dependencies?

The package react-canvas-draw has the following in its package.json on GitHub:
"dependencies": {
"catenary-curve": "^1.0.1",
"lazy-brush": "^1.0.1",
"prop-types": "^15.6.2",
"resize-observer-polyfill": "^1.5.0"
},
"peerDependencies": {
"react": "16.x"
},
"devDependencies": {
"all-contributors-cli": "^5.4.1",
"babel-eslint": "^7.2.3",
"css-loader": "^0.28.9",
"enzyme": "^3.3.0",
"enzyme-adapter-react-16": "^1.1.1",
"eslint": "^4.1.1",
"eslint-config-react-app": "^2.1.0",
"eslint-plugin-flowtype": "^2.34.1",
"eslint-plugin-import": "^2.6.0",
"eslint-plugin-jsx-a11y": "^5.1.1",
"eslint-plugin-react": "^7.1.0",
"gh-pages": "^1.1.0",
"nwb": "0.21.x",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"style-loader": "^0.19.1"
},
However, when I view the package on NPM, I see:
"dependencies": {
"catenary-curve": "^1.0.1",
"codecov": "^3.5.0", // <-- note
"coveralls": "^3.0.4", // <-- note
"lazy-brush": "^1.0.1",
"prop-types": "^15.6.2",
"resize-observer-polyfill": "^1.5.0"
},
"peerDependencies": {
"react": "16.x"
},
"devDependencies": {
"all-contributors-cli": "^5.4.1",
"babel-eslint": "^7.2.3",
"css-loader": "^0.28.9",
"enzyme": "^3.3.0",
"enzyme-adapter-react-16": "^1.1.1",
"eslint": "^4.1.1",
"eslint-config-react-app": "^2.1.0",
"eslint-plugin-flowtype": "^2.34.1",
"eslint-plugin-import": "^2.6.0",
"eslint-plugin-jsx-a11y": "^5.1.1",
"eslint-plugin-react": "^7.1.0",
"gh-pages": "^1.1.0",
"nwb": "^0.21.5",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"style-loader": "^0.19.1"
},
I noted above the two additional packages that I see: codecov and coveralls. They're also displayed in the user-friendly site.
Why are these in the NPM package entry, but not in the GitHub source?
My only thought: the words codecov and coveralls only really exist in the .travis.yml file:
before_install:
- npm install codecov coveralls
- npm install nwb
...So, npm publish is detecting the npm install commands and adding dependencies to package.json? I can't find anything to support this, but I don't have any better ideas.
You're correct in your assumption, executing npm install as of NPM v5 will add them to the package.json as dependencies. The subsequent npm publish that travis runs is then including this "updated" dependency list in the package.
It's interesting that they're shipping with those packages, as they're primarily "dev dependencies" so don't need to be included in the distributed bundle. You may want to open an issue or pull request that either declares these as dev dependencies in the package.json or includes a --save-dev in the .travis.yml.
(Though the latter would not be that great either as it would "add" those as dev deps of the published module that are not reflected on the github source).

Cannot read property 'ScrollView' of undefined on React-Native and React-Navigation 3.x

When I follow the instruction from https://reactnavigation.org/docs/en/getting-started.html
and run the application, I have this error
Requiring module "node_modules/react-native-gesture-handler/index.js", which threw an exception: TypeError:
"dependencies": {
"react": "^16.8.6",
"react-art": "^16.6.3",
"react-dom": "16.8.6",
"react-native": "^0.59.8",
"react-native-gesture-handler": "^1.2.2",
"react-native-modal-selector": "^1.0.3",
"react-native-vector-icons": "^6.1.0",
"react-native-web": "0.11.2",
"react-navigation": "^3.0.0"
},
"resolutions": {
"uglify-es": "3.2.2"
},
"devDependencies": {
"#types/jest": "24.0.12",
"#types/node": "^10.12.12",
"#types/react": "16.8.15",
"#types/react-dom": "^16.0.11",
"#types/react-native": "^0.57.60",
"#types/react-navigation": "^3.0.7",
"#types/react-test-renderer": "16.8.1",
"babel-jest": "24.7.1",
"jest": "24.7.1",
"metro-react-native-babel-preset": "0.50.0",
"prettier": "1.17.0",
"react-art": "16.8.6",
"react-native-typescript-transformer": "^1.2.10",
"react-scripts": "3.0.0",
"react-scripts-ts": "^3.1.0",
"react-test-renderer": "16.8.6",
"ts-jest": "24.0.2",
"tslint": "5.16.0",
"tslint-config-prettier": "1.18.0",
"typescript": "3.4.5"
},
You need to install react-native-gesture-handler package to make it works npm install --save react-native-gesture-handler and link it.
Complete installation guide can be found here: https://kmagiera.github.io/react-native-gesture-handler/docs/getting-started.html

How to install necessary packages by `npm install`

I have the following in package.json.
{
"private": true,
"devDependencies": {
"gulp": "^3.8.8"
},
"dependencies": {
"laravel-elixir": "^4.0.0",
"bootstrap-sass": "^3.0.0"
}
}
After running npm install when I check node_modules, there are a lot of packages are installed. from .bin, abbrev to yeast. I think there are more than 200 packages. I thought npm installs only necessary packages including dependencies.
Q1: How can I avoid installing unnecessary packages and installing only necessary packages. Can I do it? Or do I need all packages?
Q2: Does npm install all npm packages?
Summary:
Q1: How can I avoid installing unnecessary packages and installing
only necessary packages. Can I do it? Or do I need all packages?
You are installing all dependencies required by the dependencies of your module (modules requiring modules).
Q2: Does npm install all npm packages?
No.
In depth:
You installed gulp. Here are gulp's dependencies:
"dependencies": {
"archy": "^1.0.0",
"chalk": "^1.0.0",
"deprecated": "^0.0.1",
"gulp-util": "^3.0.0",
"interpret": "^1.0.0",
"liftoff": "^2.1.0",
"minimist": "^1.1.0",
"orchestrator": "^0.3.0",
"pretty-hrtime": "^1.0.0",
"semver": "^4.1.0",
"tildify": "^1.0.0",
"v8flags": "^2.0.2",
"vinyl-fs": "^0.3.0"
}
archy has the following dependencies:
"dependencies": {
"ansi-styles": "^2.1.0",
"escape-string-regexp": "^1.0.2",
"supports-color": "^3.1.2"
},
interpret (still going through gulp dependencies) has the following dependencies:
"dependencies": {
"extend": "^2.0.1",
"findup-sync": "^0.3.0",
"flagged-respawn": "^0.3.1",
"rechoir": "^0.6.0",
"resolve": "^1.1.6"
}
liftoff has the following dependencies:
"dependencies": {
"extend": "^2.0.1",
"findup-sync": "^0.3.0",
"flagged-respawn": "^0.3.1",
"rechoir": "^0.6.0",
"resolve": "^1.1.6"
}
orchestrator requires the following dependencies:
"dependencies": {
"end-of-stream": "~0.1.5",
"sequencify": "~0.0.7",
"stream-consume": "~0.1.0"
},
...
In short... The bigger, more dependent module you install, the more dependencies are required. It's not always a bad thing. I recommend installing only what is needed to get the job you need done (sometimes it's a lot, sometimes not).
UPDATE
I just noticed that gulp was a dev-dependency... Moving on to elixir non-dev dependencies:
"dependencies": {
"babelify": "^7.2.0",
"browser-sync": "^2.7.10",
"browserify": "^11.2.0",
"del": "^1.2.0",
"glob": "^5.0.14",
"gulp-autoprefixer": "^2.3.1",
"gulp-babel": "^6.1.0",
"babel-preset-es2015": "^6.1.0",
"babel-preset-react": "^6.1.18",
"gulp-batch": "^1.0.5",
"gulp-coffee": "^2.3.1",
"gulp-concat": "^2.6.0",
"gulp-cssnano": "^2.0.0",
"gulp-if": "^1.2.5",
"gulp-less": "^3.0.3",
"gulp-load-plugins": "^1.0.0-rc.1",
"gulp-notify": "^2.2.0",
"gulp-phpspec": "^0.5.3",
"gulp-phpunit": "0.11.x",
"gulp-rename": "^1.2.2",
"gulp-rev": "^5.1.0",
"gulp-rev-replace": "^0.4.2",
"gulp-sass": "^2.0.3",
"gulp-sourcemaps": "^1.5.2",
"gulp-shell": "^0.5.0",
"gulp-uglify": "^1.4.2",
"gulp-util": "^3.0.6",
"gulp-watch": "^4.2.4",
"insert-css": "^0.2.0",
"merge-stream": "^0.1.8",
"parse-filepath": "^0.5.0",
"partialify": "^3.1.3",
"path": "^0.11.14",
"require-dir": "^0.3.0",
"run-sequence": "^1.1.1",
"underscore": "^1.8.3",
"underscore-deep-extend": "0.0.5",
"vinyl-buffer": "^1.0.0",
"vinyl-paths": "^1.0.0",
"vinyl-source-stream": "^1.1.0",
"watchify": "^3.2.3"
},
...