O que são node_modules, package.json e package-lock.json
Entenda o que são node_modules, package.json, package-lock.json, dependências e scripts em projetos frontend modernos.
- #Node.js
- #npm
- #package.json
- #node_modules
- #Frontend
Por que aparecem tantos arquivos em um projeto moderno?
Quando você cria uma página simples com HTML, CSS e JavaScript, os arquivos são poucos. Quando começa a usar React, Vite, TypeScript, Tailwind CSS e outras ferramentas, aparecem nomes como node_modules, package.json e package-lock.json.
Esses arquivos fazem parte do ecossistema Node.js e npm. Eles existem para que o projeto saiba quais bibliotecas usa, quais comandos pode executar e quais versões devem ser instaladas.
O que é node_modules?
A pasta node_modules é onde ficam as bibliotecas instaladas no projeto. Quando você roda npm install, o npm lê o package.json e baixa as dependências necessárias.
Você não deve editar arquivos dentro de node_modules e também não deve enviar essa pasta para o GitHub. Ela deve ficar no .gitignore.
node_modules é a pasta onde o npm baixa as bibliotecas. Ela pode ficar grande e não deve ser enviada para o GitHub, porque pode ser recriada com npm install.
node_modules
dist
.envO que é package.json?
O package.json é o arquivo de configuração principal de um projeto Node/npm. Ele guarda nome do projeto, versão, scripts, dependências, dependências de desenvolvimento e configurações usadas por ferramentas.
Leia o package.json como a ficha técnica do projeto. Ele guarda nome, versão, scripts e dependências. Quando alguém baixa o projeto, esse arquivo ajuda a saber quais pacotes precisam ser instalados.
{
"name": "projeto-react",
"version": "1.0.0",
"scripts": {
"dev": "vite",
"build": "vite build"
},
"dependencies": {
"react": "^19.0.0",
"react-dom": "^19.0.0"
},
"devDependencies": {
"typescript": "^5.0.0",
"vite": "^6.0.0"
}
}Scripts, dependencies e devDependencies
Scripts são comandos curtos definidos no package.json. Dependencies são bibliotecas que a aplicação precisa para funcionar. DevDependencies são bibliotecas usadas durante o desenvolvimento, build, formatação ou validação.
Lendo o fluxo: npm install lê package.json e package-lock.json, baixa as dependências para node_modules e prepara o projeto para rodar os scripts.
npm run dev
npm run buildO que é package-lock.json?
O package-lock.json guarda a árvore exata de dependências instalada. O package.json pode declarar uma faixa de versão, enquanto o lock file registra exatamente quais versões foram instaladas naquele momento.
Quando outra pessoa clona seu projeto, ela deve rodar npm install para recriar node_modules usando package.json e package-lock.json.
package-lock.json registra as versões exatas instaladas. Diferente de node_modules, ele deve ser enviado para o GitHub para ajudar outras pessoas a instalar versões compatíveis.
npm install
