I am curious how to do it correctly, I see many of those package can be either "dependencies" or "devDependencies". Does it really matter how do I install them?
{
"name": "abcd",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@date-io/date-fns": "^1.3.13",
"@fortawesome/fontawesome-svg-core": "^1.2.35",
"@fortawesome/free-solid-svg-icons": "^5.15.3",
"@fortawesome/react-fontawesome": "^0.1.14",
"@material-ui/core": "^4.11.2",
"@material-ui/icons": "^4.11.2",
"@material-ui/lab": "^4.0.0-alpha.57",
"@material-ui/pickers": "^3.2.10",
"@next/bundle-analyzer": "^11.1.2",
"@reduxjs/toolkit": "^1.6.1",
"@styled-system/css": "^5.1.5",
"@swan-bitcoin/xpub-lib": "^0.1.0",
"@types/accounting": "^0.4.1",
"@types/axios": "^0.14.0",
"@types/cors": "^2.8.10",
"@types/crypto-js": "^4.0.1",
"@types/date-fns": "^2.6.0",
"@types/material-ui": "^0.21.8",
"@types/next": "^9.0.0",
"@types/node": "^15.0.2",
"@types/qrcode.react": "^1.0.1",
"@types/query-string": "^6.3.0",
"@types/react-copy-to-clipboard": "^5.0.0",
"@types/react-csv": "^1.1.1",
"@types/react-date-range": "^1.1.8",
"@types/react-ga": "^2.3.0",
"@types/react-qr-reader": "^2.1.3",
"accounting": "^0.4.1",
"accounting-js": "^1.1.1",
"axios": "^0.21.1",
"bip32": "^2.0.6",
"bootstrap": "5.1.0",
"cors": "^2.8.5",
"cross-env": "^7.0.3",
"crypto-js": "^4.0.0",
"date-fns": "^2.25.0",
"detect-browser-language": "^0.0.2",
"konva": "^7.2.5",
"material-ui": "^0.20.2",
"next": "10.0.5",
"next-redux-wrapper": "^7.0.4",
"prettier": "^2.2.1",
"qrcode.react": "^1.0.1",
"query-string": "^6.13.8",
"react": "17.0.1",
"react-bitcoin-qr": "^0.0.3",
"react-bootstrap": "^2.0.0-beta.5",
"react-copy-to-clipboard": "^5.0.3",
"react-country-region-selector": "^3.0.2",
"react-countup": "^5.2.0",
"react-csv": "^2.0.3",
"react-date-range": "^1.4.0",
"react-dom": "17.0.1",
"react-facebook-login": "^4.1.1",
"react-ga": "^3.3.0",
"react-google-login": "^5.2.2",
"react-icons": "^4.2.0",
"react-konva": "^17.0.2-0",
"react-leaf-carousel": "^2.0.3",
"react-messenger-customer-chat": "^0.8.0",
"react-meta-tags": "^1.0.1",
"react-multi-carousel": "^2.6.1",
"react-parallax": "^3.3.0",
"react-player": "^2.9.0",
"react-qr-reader": "^2.2.1",
"react-redux": "^7.2.5",
"react-responsive-carousel": "^3.2.11",
"react-visibility-sensor": "^5.1.1",
"redux": "^4.1.1",
"redux-persist": "^6.0.0",
"redux-saga": "^1.1.3",
"sass": "^1.42.1",
"sharp": "^0.28.3",
"styled-components": "^5.3.0",
"styled-icons": "^10.38.0",
"styled-system": "^5.1.5",
"styled-system-html": "^3.0.0",
"use-image": "^1.0.8",
"uuidv4": "^6.2.6"
},
"devDependencies": {
"@types/react": "^17.0.21",
"eslint": "7.32.0",
"eslint-config-next": "11.1.2",
"typescript": "^4.4.3"
}
}
