区别Grunt, NPM和Bower(包。Json vs凉亭。json)

Npm和Bower都是依赖管理工具。但两者之间的主要区别是npm用于安装Node js模块，但bower js用于管理前端组件，如html, css, js等。

更让人困惑的是，npm提供了一些可以在前端开发中使用的包，比如grunt和jshint。

这些台词增加了更多的含义

与npm不同，Bower可以有多个文件(例如.js， .css， .html， .png， .ttf)，这些文件被认为是主文件。当打包在一起时，Bower从语义上将这些主文件视为一个组件。

编辑: 咕哝着说与Npm和Bower有很大不同。Grunt是一个javascript任务运行器工具。你可以使用grunt做很多事情，否则你必须手动完成。重点介绍Grunt的一些用法:

1. 压缩一些文件(例如zip插件)
2. 检测js文件(jshint)
3. 编译更少的文件(grunt-contrib-less)

有一些grunt插件用于sass编译，丑陋你的javascript，复制文件/文件夹，缩小javascript等。

请注意，grunt插件也是一个npm包。

问题1

当我想添加一个包(并将依赖项签入git)，它属于哪里-进入包。Json或者变成bower。Json

这要看这个包裹是放在哪里。如果它是一个节点模块(如grunt,request)，那么它将被放在包中。Json，否则为bower Json。

问题2

什么时候我应该像这样显式地安装包，而不将它们添加到管理依赖关系的文件中

无论你是显式地安装包，还是在.json文件中提到依赖关系。假设你正在做一个节点项目，你需要另一个项目，比如request，那么你有两个选择:

• 编辑包。Json文件，并在“请求”上添加依赖项
• npm安装

或

• 使用命令行:npm install --save request

--save options将依赖添加到包中。Json文件。如果你不指定--save选项，它将只下载包，但json文件将不受影响。

你可以用任何一种方式来做，不会有实质性的区别。

# EYZ0:

事情变化得如此之快，如果到了2017年底，这个答案可能就不再是最新的了!

初学者可能很快就会迷失在构建工具和工作流的选择中，但2016年最流行的是根本不用Bower、Grunt或Gulp !在Webpack的帮助下，你可以直接在NPM中做任何事情!

• 谷歌"npm as build tool" result: 李# EYZ0 < / p > < / >

• Webpack: https://webpack.github.io/docs/installation.html

不要误解我的意思，人们使用其他工作流程，我仍然在我的遗留项目中使用GULP(但慢慢地离开了它)，但这是最好的公司和开发人员在这个工作流程中赚了很多钱!

• Webpack
• NPM作为构建工具(没有Gulp, Grunt或Bower)
• 与Redux反应
• ESLint
• 这个名单很长。去探索吧!

你的问题:

当我想添加一个包(并将依赖项检入git)， 它应该放在哪里，放在包里。

. Json

• 所有东西都要打包。json现在

• 构建所需的依赖项在“devDependencies”中，即npm install require-dir --save-dev(——save-dev更新你的包。添加一个条目到devDependencies)

• 应用程序在运行时所需的依赖项在“Dependencies”中，即npm install lodash --save(——save更新包。Json)

如果是这样的话，我应该在什么时候像这样显式地安装包，而不将它们添加到管理依赖关系的文件中(除了全局安装命令行工具)?

# EYZ6。只是因为舒适。当你添加一个标志(--save-dev或--save)，管理deps的文件(package.json)会自动更新。不要浪费时间手动编辑其中的依赖项。npm install --save-dev package-name的快捷键是npm i -D package-name， npm install --save package-name的快捷键是npm i -S package-name