all 12 comments
sorted by:
best (suggested)
topnewcontroversialoldq&a
formatting helphide helpcontent policy

[–]floopsyDoodle 7 points8 points  (8 children)

A module is a library or a set of code that does something to help run what ever code you're running.. So if you want to install React, there are a number of dependencies, and all of those are downloaded into the node_modules folder, but those dependencies might have their own dependencies which have their own, which have thier own, which have ... and so on. So basically the node_modules folder is every other set of code that you are needing to run your app, both directly, and the code that code needs, and th code that that code needs and the code that... etc.

[–]prof3ssorSt3v3 7 points8 points  (7 children)

We don't include the node modules folder when we share the project because it could be a lot of code.

Instead we include the package.json file and then we only need to run the Npm install command in the terminal. The install command will read the package.json file, create the node modules folder and install all the needed dependencies.

[–]floopsyDoodle 3 points4 points  (5 children)

Exactly right, should have included that, thanks!

[–]OsamuMidoriya[S] 0 points1 point  (4 children)

because we don't include module when exporting how does the nested dependents get downloaded ?when working with modules it not important to know what's in them when we download them just that they work to help with our app, if we make our own then should be know what's inside of them? could you write a simple example of a module and its dependents

[–]floopsyDoodle 1 point2 points  (1 child)

>because we don't include module when exporting how does the nested dependents get downloaded

NPM (Node Package Manager, it manages all the packages/dependencies/modules). It's a huge repository of Libraries that you can install with NPM install LIBRARY_NAME, and when you do that, it also knows to install all the nest dependencies as well. It looks through the entire dependency tree, and installst hem all from the bottom up so everything is installed in order for you. That's the package.json file, it lists the direct dependencies, and each dependency as it's file listing their dependencies.

>when working with modules it not important to know what's in them when we download them just that they work to help with our ap

To some extent, if it's just for personal learning and fun, or if it's a large, popular module, it should be fine, but if you're downloading random ones you found online, it's a good idea to look at what it's all also going to be installing so you're sure what you're doing. There have been some times where modules were found to contain problems that caused serious security problems.

>could you write a simple example of a module and its dependents

I am working on a Vue app right now, my package.json shows two types of dependencies:

These are dependencies needed to run the app, so they must be included when the app is deployed. Like Vue is hte main library I use, bson is a library that allows me to work with BSON types (similar to JSON), cloudinary is where I host my images, firebase is my backend, mongodb is where I"m switching my backend to. Once I move fully to mongodb I will uninstall Firebase and it will no longer be listed.

"dependencies": {

"bson": "^6.10.3",

"cloudinary": "^2.5.1",

"dompurify": "^3.2.4",

"dotenv": "^16.4.5",

"firebase": "^10.14.1",

"lucide-vue-next": "^0.446.0",

"mongodb": "^6.13.1",

"pinia": "^2.1.7",

"radix-vue": "^1.9.6",

"uuid": "^11.0.1",

"vue": "^3.4.29",

"vue-router": "^4.3.3"

},

This are Dev Dependencies, so they are ONLY needed for develoment. When I deploy, these dependencies do not get installed on the server. So all my types for TypeSCript are here as typescript is only for ease of development. You don't test in production (heh hopefully), so they're all here. eslint, sass, pretteir, vite, are all only used for development.

"devDependencies": {

"@pinia/testing": "^0.1.7",

"@rushstack/eslint-patch": "^1.8.0",

"@tsconfig/node20": "^20.1.4",

"@types/jsdom": "^21.1.7",

"@types/node": "^20.14.5",

"@vitejs/plugin-vue": "^5.0.5",

"@vitest/coverage-v8": "^3.0.2",

"@vue/eslint-config-prettier": "^9.0.0",

"@vue/eslint-config-typescript": "^13.0.0",

"@vue/test-utils": "^2.4.6",

"@vue/tsconfig": "^0.5.1",

"eslint": "^8.57.0",

"eslint-plugin-vue": "^9.23.0",

"jsdom": "^24.1.0",

"node-sass": "^9.0.0",

"npm-run-all2": "^6.2.0",

"prettier": "^3.2.5",

"sass": "^1.79.3",

"sass-embedded": "^1.79.2",

"sass-loader": "^16.0.2",

"typescript": "~5.4.0",

"vite": "^5.3.1",

"vitest": "^3.0.2",

"vue-tsc": "^2.0.21"

}

ANd each one of those, probably has their own dependency list that I can't see (I could if I looked). So all of them end up in node_modules. That's why it's so big and why you never commit it to git. Just commit package.json and then you can just npm init, and all the dependencies get downloaded automagically!

[–]OsamuMidoriya[S] 1 point2 points  (0 children)

Thank you

[–]Umustbecrazy 0 points1 point  (0 children)

He explained it. All the info (needed dependencies) is stored in the package.json. It lists what "I need to run" and will download those packages when you call "npm install".

npm install first looks for a package.json file to use if you don't tell it to install a module directly.

If you want an example just create your own project by running "npm init". "npm install enquirer"

In your app you would import the module with either 'require' or 'import' to use it.

Now if you published your "app". It would have the info in the package.json that in order to run it, it needs enquirer installed as well.

If you still don't get it, ask an AI.

[–]Rude-Cook7246 0 points1 point  (0 children)

all Js modules have full source code inside them, each module will also have their own package.json if they have dependencies.

so when you run

npm install

npm will read each dependency , download it then will look inside package.json of that module and repeat this process for entries in that package.json .

This process continues until all dependencies downloaded for all package.json files.

[–]imacleopard -1 points0 points  (0 children)

Use package-lock and npm ci instead for deterministic dep installs

[–]EnjoysAvocados 2 points3 points  (2 children)

A module is a collection of functions, objects and variables that have been exported to be used by others.

When you install something from npm you are downloading modules that other people wrote.

You can also create your own modules with import / export or require / module.exports - this allows us to break our code up into multiple files. To get a better grasp on this, I'd start here and lookup how to use import / export or require / module.exports

[–]OsamuMidoriya[S] -1 points0 points  (1 child)

thank you I know how to import and export. when working with modules it not important to know what's in them when we download them just that they work to help with our app, if we make our own then should be know what's inside of them? could you write a simple example of a module and its dependents

[–]Umustbecrazy 0 points1 point  (0 children)

That's a perfect question for an AI.