I want to know what make "npm install" install #angula from this package.json dependecies ?
"dependencies": {
"#trust/webcrypto": "^0.9.0",
"body-parser": "^1.18.2",
"civic-sip-api": "^1.0.1",
"cookie-parser": "^1.4.3",
"cors": "^2.8.4",
"ethereumjs-testrpc": "^6.0.3",
"express": "^4.16.3",
"express-jwt": "^5.3.1",
"gun": "^0.9.993",
"ipfs": "^0.28.2",
"jsonwebtoken": "^8.2.1",
"md5": "^2.2.1",
"orbit-db": "^0.19.7",
"passport": "^0.4.0",
"passport-local": "^1.0.0",
"sha3": "^1.2.0",
"socket.io": "^2.1.0",
"socketio-jwt": "^4.5.0",
"uport-connect": "^0.7.2",
"web3": "^0.20.6"
},
after running "npm install" in the project folder I got some non needed package such as #angular, #angular-devkit, #ngtools
They are dependencies of each module. If you open up each module it has a package.json with the dependencies of the installing module.
Related
I've updated my modules in the package.json and I'm now getting the error "Unable to resolve module util from node_modules\uuidv4\build\lib\uuidv4.js: util could not be found within the project."
Of the steps below, I've done #2. I'm not using watchman for #1, I'm using npm instead of yarn for #3, and I don't know what path #4 is referring to. Here is my full output.
PS C:\Dev\myProj> react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res/
(node:16148) Warning: Accessing non-existent property 'padLevels' of module exports inside circular dependency
(Use node --trace-warnings ... to show where the warning was created)
Welcome to React Native!
Learn once, write anywhere
error Unable to resolve module util from node_modules\uuidv4\build\lib\uuidv4.js: util could not be found within the project.
If you are sure the module exists, try these steps:
Clear watchman watches: watchman watch-del-all
Delete node_modules: rm -rf node_modules and run yarn install
Reset Metro's cache: yarn start --reset-cache
Remove the cache: rm -rf /tmp/metro-*. Run CLI with --verbose flag for more details.
Error: Unable to resolve module util from node_modules\uuidv4\build\lib\uuidv4.js: util could not be found within the project.
If you are sure the module exists, try these steps:
Clear watchman watches: watchman watch-del-all
Delete node_modules: rm -rf node_modules and run yarn install
Reset Metro's cache: yarn start --reset-cache
Remove the cache: rm -rf /tmp/metro-*
at ModuleResolver.resolveDependency (C:\Dev\myProj\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:186:15)
at ResolutionRequest.resolveDependency (C:\Dev\myProj\node_modules\metro\src\node-haste\DependencyGraph\ResolutionRequest.js:52:18)
at DependencyGraph.resolveDependency (C:\Dev\myProj\node_modules\metro\src\node-haste\DependencyGraph.js:287:16)
at Object.resolve (C:\Dev\myProj\node_modules\metro\src\lib\transformHelpers.js:267:42)
at C:\Dev\myProj\node_modules\metro\src\DeltaBundler\traverseDependencies.js:434:31
at Array.map ()
at resolveDependencies (C:\Dev\myProj\node_modules\metro\src\DeltaBundler\traverseDependencies.js:431:18)
at C:\Dev\myProj\node_modules\metro\src\DeltaBundler\traverseDependencies.js:275:33
at Generator.next ()
at asyncGeneratorStep (C:\Dev\myProj\node_modules\metro\src\DeltaBundler\traverseDependencies.js:87:24)
Here is my package.json file
{
"name": "myproj",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "react-native start",
"prettier": "prettier --write '*.js' 'src/**/*.js'",
"test": "jest",
"lint": "eslint .",
"android": " cd android && ./gradlew clean && cd .. && react-native run-android",
"ios": "react-native run-ios"
},
"dependencies": {
"#react-native-community/async-storage": "^1.11.0",
"#react-native-community/cameraroll": "^4.0.0",
"#react-native-community/geolocation": "^2.0.2",
"#react-native-community/masked-view": "^0.1.10",
"#react-native-firebase/app": "^8.3.1",
"#react-native-firebase/auth": "^8.3.3",
"#react-native-firebase/messaging": "^7.7.1",
"#skele/components": "^1.0.0-alpha.40",
"axios": "^0.19.2",
"base-64": "^0.1.0",
"crypto-js": "^4.0.0",
"expo-av": "~8.4.0",
"expo-blur": "^8.1.2",
"expo-camera": "^8.3.1",
"expo-constants": "~9.1.1",
"expo-facebook": "~8.2.1",
"expo-file-system": "^9.1.0",
"expo-firebase-recaptcha": "^1.1.3",
"expo-image-picker": "~8.4.0",
"expo-localization": "~8.2.1",
"expo-location": "~8.3.0",
"expo-permissions": "^9.1.0",
"firebase": "7.18.0",
"formik": "^2.1.5",
"i18n-js": "^3.7.1",
"invert-color": "^2.0.0",
"jest-haste-map": "^26.3.0",
"jest-serializer": "^26.3.0",
"jest-worker": "^26.3.0",
"lodash": "^4.17.20",
"lodash.isequal": "^4.5.0",
"lodash.memoize": "^4.1.2",
"mobx": "^5.15.6",
"mobx-react": "^6.2.5",
"moment": "^2.27.0",
"oauth-1.0a": "^2.2.6",
"react": "16.13.1",
"react-native": "0.63.2",
"react-native-actionsheet": "^2.4.2",
"react-native-animatable": "^1.3.3",
"react-native-app-intro-slider": "^4.0.4",
"react-native-appearance": "~0.3.4",
"react-native-autogrow-textinput": "^5.4.0",
"react-native-button": "^3.0.1",
"react-native-confirmation-code-field": "^6.5.0",
"react-native-dialog-input": "^1.0.8",
"react-native-fast-image": "^8.3.2",
"react-native-fbsdk": "2.0.0",
"react-native-geocoding": "^0.4.0",
"react-native-gesture-handler": "^1.7.0",
"react-native-get-random-values": "^1.4.0",
"react-native-google-places-autocomplete": "^1.8.0",
"react-native-image-crop-picker": "^0.32.2",
"react-native-image-filter-kit": "^0.7.3",
"react-native-image-picker": "^2.3.3",
"react-native-image-progress": "^1.1.1",
"react-native-image-view": "^2.1.9",
"react-native-indicators": "^0.17.0",
"react-native-iphone-x-helper": "^1.2.1",
"react-native-keyboard-aware-scroll-view": "^0.9.2",
"react-native-keyboard-aware-view": "0.0.14",
"react-native-keyboard-input": "^6.0.2",
"react-native-keyboard-tracking-view": "^5.7.0",
"react-native-localize": "^1.4.1",
"react-native-maps": "0.27.1",
"react-native-modal": "^11.5.6",
"react-native-modal-patch": "git+https://github.com/HarvestProfit/react-native-modal-patch.git",
"react-native-modalbox": "^2.0.0",
"react-native-phone-input": "^0.2.4",
"react-native-popup-menu": "^0.15.9",
"react-native-progress": "^4.1.2",
"react-native-reanimated": "^1.13.0",
"react-native-safe-area-context": "^3.1.4",
"react-native-screens": "^2.10.1",
"react-native-search-box": "0.0.19",
"react-native-slider": "^0.11.0",
"react-native-splash-screen": "^3.2.0",
"react-native-swiper": "^1.6.0-nightly.5",
"react-native-unimodules": "^0.10.1",
"react-native-vector-icons": "7.0.0",
"react-native-video": "^5.0.2",
"react-native-view-more-text": "^2.1.0",
"react-native-webview": "^10.7.0",
"react-navigation": "^4.4.0",
"react-navigation-drawer": "^2.5.0",
"react-navigation-redux-helpers": "^4.0.1",
"react-navigation-stack": "^2.8.2",
"react-navigation-tabs": "^2.9.0",
"react-redux": "^7.2.1",
"redux": "^4.0.5",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.3.0",
"remote-redux-devtools": "^0.5.16",
"uuidv4": "^6.2.2"
},
"devDependencies": {
"#babel/core": "^7.11.1",
"#babel/plugin-proposal-decorators": "^7.10.5",
"#babel/runtime": "^7.11.2",
"#react-native-community/eslint-config": "^2.0.0",
"babel-jest": "^26.3.0",
"babel-plugin-transform-remove-console": "^6.9.4",
"eslint": "7.7.0",
"jest": "^26.4.0",
"metro-react-native-babel-preset": "^0.62.0",
"prettier": "2.0.5",
"react-test-renderer": "16.13.1"
},
"jest": {
"preset": "react-native"
}
}
I had to roll back:
"uuidv4": "^5.0.1"
None of the answers provided here worked for me. I tried
Reverting to "uuidv4": "^5.0.1"
Reverting to "uuidv4": "^3.0.1"
Deliting the node_modules folder and then running npm i
What fixed it for me was using this UUID generation instead https://www.npmjs.com/package/react-native-uuid
Search somewhere you have imported "uuidv4" in your project and remove it.
Delete the node-modules folder from your project and after that run npm-install for generating it again. This worked for me.
Then import uuidv4 from uuid library
const { v4: uuidv4 } = require('uuid');
Inside function:
setTodo(prevTodo => {
`return [...prevTodo,{id:uuidv4(), name: name, complete:false}]
})
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).
I have a project where I use npm for handling dependencies. The project is bundled with Webpack and will run on the client (it's built for using gh-pages for hosting) with no production dependencies. Therefore I have only devDependencies in my package.json. However, when I run npm install nothing gets installed. When I run npm install --dev my dependencies gets installed as they are supposed to. Since --dev is deprecated I tried with npm install --only=dev as well, however nothing gets installed then either! Is there something broken in my package.json (inserted below) or am I misunderstanding npm?
{
"name": "Boilerplate",
"version": "0.0.1",
"description": "A boilerplate to quickly get started with an offline first React/Redux app",
"repository": {
"type": "git",
"url": "https://github.com/OskarKlintrot/Offline-First-React-And-Redux-Boilerplate"
},
"scripts": {
"start": "webpack-dev-server",
"build": "webpack --progress --colors --production"
},
"private": true,
"devDependencies": {
"babel-core": "^6.2.1",
"babel-eslint": "^4.0.5",
"babel-loader": "^6.2.0",
"babel-polyfill": "^6.2.0",
"babel-preset-es2015": "^6.1.18",
"babel-preset-react": "^6.1.18",
"babel-preset-stage-1": "^6.1.18",
"eslint": "^1.1.0",
"eslint-loader": "^1.0.0",
"eslint-plugin-react": "^3.13.1",
"file-loader": "^0.8.5",
"history": "^1.17.0",
"react": "^0.14.2",
"react-dom": "^0.14.2",
"react-hot-loader": "^1.3.0",
"react-mdl": "^1.0.2",
"react-redux": "^4.0.4",
"react-router": "^1.0.2",
"react-tap-event-plugin": "^0.2.1",
"redux": "^3.0.5",
"redux-devtools": "^3.0.0",
"redux-devtools-dock-monitor": "^1.0.1",
"redux-devtools-log-monitor": "^1.0.1",
"redux-history-transitions": "^1.0.0",
"redux-thunk": "^1.0.2",
"transfer-webpack-plugin": "^0.1.4",
"webpack": "^1.12.9",
"webpack-dev-server": "^1.14.0"
}
}
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"
},
...
redux-router#1.0.0-beta4 only has deep-equal as the dependencies.
redux-router/package.json
"devDependencies": {
"babel": "^5.6.14",
"babel-core": "5.6.15",
"babel-eslint": "^4.1.1",
"babel-loader": "^5.3.2",
"chai": "^3.0.0",
"eslint": "^1.3.1",
"eslint-config-airbnb": "0.0.8",
"eslint-plugin-react": "^3.3.1",
"history": "^1.9.0",
"jsdom": "^5.6.0",
"mocha": "^2.2.5",
"mocha-jsdom": "^1.0.0",
"node-libs-browser": "^0.5.2",
"react": "^0.14.1",
"react-addons-test-utils": "^0.14.1",
"react-dom": "^0.14.1",
"react-redux": "^4.0.0",
"react-router": "1.0.0",
"redux": "3.x",
"redux-devtools": "^2.1.0",
"rimraf": "^2.4.3",
"sinon": "^1.15.4",
"webpack": "^1.12.1"
},
"dependencies": {
"deep-equal": "^1.0.1"
}
But history is installed in node_modules when I install redux-router#1.0.0-beta4.
Why is history installed in it?
history is used in redux-router#1.0.0-beta4. But it doesn't specify its dependencies same as react, redux...
It occurs regardless of npm versions.
npm v3.4.1
% npm i redux-router#1.0.0-beta4
/Users/koba04/test
└─┬ redux-router#1.0.0-beta4
└── deep-equal#1.0.1
% ls node_modules/
deep-equal redux-router
% ls node_modules/redux-router/node_modules
history
npm v2.14.3
% npm i redux-router#1.0.0-beta4
redux-router#1.0.0-beta4 node_modules/redux-router
└── deep-equal#1.0.1
% ls node_modules
redux-router
% ls node_modules/redux-router/node_modules
deep-equal history
It was an npm's bug and fixed it.
https://github.com/reactjs/react-router-redux/issues/133