Why are packages in my yarn.lock but not in my package.json?

Question

I started this project with create-react-app and then ejected. I'm currently analyzing my webpack bundle and I get this.

I ran this command to analyze my bundle -

source-map-explorer main.<hash>.js main.<hash>.js.map

I have a couple of questions -

1. I use moment.js in my application, however when looking at my package.json, it is not there. It does exist in my yarn.lock. Why is this happening? Why does my application even work?

2. I use lodash, but I have taken care to import specific lodash functions (import map from "lodash/map", for example). However, I see lodash in my node_module..despite never having imported it. Why is this working? Is it because a dependency of mine has a dependency on the whole lodash package and I'm just getting lucky?

3. How do I get source-map-explorer to analyze my production build? I tried the steps in the CRA documentation, but they error.

Why is the above happening?

For full reference here is my package.json's dependencies/devDependencies.

{
  "dependencies": {
    "autoprefixer": "7.1.6",
    "babel-core": "6.26.0",
    "babel-eslint": "7.2.3",
    "babel-jest": "20.0.3",
    "babel-loader": "7.1.2",
    "babel-polyfill": "^6.26.0",
    "babel-preset-react-app": "^3.1.0",
    "babel-runtime": "6.26.0",
    "case-sensitive-paths-webpack-plugin": "2.1.1",
    "chalk": "1.1.3",
    "cross-env": "5.1.4",
    "css-loader": "0.28.7",
    "dotenv": "4.0.0",
    "eslint": "4.10.0",
    "eslint-config-react-app": "^2.0.1",
    "eslint-loader": "1.9.0",
    "eslint-plugin-flowtype": "2.39.1",
    "eslint-plugin-import": "2.8.0",
    "eslint-plugin-jsx-a11y": "5.1.1",
    "eslint-plugin-react": "7.4.0",
    "extract-text-webpack-plugin": "3.0.2",
    "file-loader": "1.1.5",
    "fs-extra": "3.0.1",
    "html-webpack-plugin": "2.29.0",
    "jest": "20.0.4",
    "object-assign": "4.1.1",
    "postcss-flexbugs-fixes": "3.2.0",
    "postcss-loader": "2.0.8",
    "promise": "8.0.1",
    "query-string": "^5.1.0",
    "raf": "3.4.0",
    "react": "^16.2.0",
    "react-collapse": "^4.0.3",
    "react-countdown-now": "^1.3.0",
    "react-dev-utils": "^4.2.1",
    "react-dom": "^16.2.0",
    "react-grecaptcha": "^1.2.5",
    "react-md-spinner": "^0.2.5",
    "react-motion": "^0.5.2",
    "react-player": "^1.1.1",
    "react-redux": "^5.0.6",
    "react-responsive": "^4.0.3",
    "react-router-dom": "^4.2.2",
    "react-router-hash-link": "^1.2.0",
    "react-select": "^1.2.1",
    "redux": "^3.7.2",
    "redux-thunk": "^2.2.0",
    "style-loader": "0.19.0",
    "sw-precache-webpack-plugin": "0.11.4",
    "url-loader": "0.6.2",
    "webpack": "3.8.1",
    "webpack-dev-server": "2.9.4",
    "webpack-manifest-plugin": "1.3.2",
    "whatwg-fetch": "2.0.3",
    "xelpmoc-core": "^0.3.1"
  },
  "devDependencies": {
    "compression-webpack-plugin": "^1.1.3",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "eslint": "^4.14.0",
    "eslint-config-recommended": "^2.0.0",
    "eslint-plugin-react": "^7.5.1",
    "google-map-react": "^0.34.0",
    "husky": "^0.14.3",
    "lint-staged": "^6.0.0",
    "pm2": "^2.9.1",
    "prettier": "^1.9.2",
    "redux-mock-store": "^1.4.0"
  },
}

Answer 1

yarn.lock is a "lockfile" which locks down your dependency tree so that when another teammate (or CI server) runs the build it gets the same dependencies (and thus the same build). The lockfile lists not just dependencies but deps of deps.

NPM/yarn flattens dependencies in node_modules when possible so you probably have some dependencies which are installing lodash/moment. You can debug this by running npm ls lodash to see where it's coming from. You should definitely install those packages that you are using but you've gotten "by accident".

I can't answer #3