前景提要
如果要说最简单的一个项目能是什么样子。那就只需要一个html文件就行了（css和js都内联进去，html也通过各种设置显示或者隐藏来达到切换页面的效果，图片的话，就用远程链接）。但是这样的项目根本没法管理。这个文件会非常大。并且浏览器必须同时加载全部。没人会这么做。
于是，将html、css、js分开来管理，就有了index.html、index.css、index.js这三个文件构成的项目。或者按照功能将这三种文件再次拆分开来。
|-my-web/
|--login.html
|--login.css
|--login.js
|--news.html
|--news.css
|--news.js
...
接着，我们再将文件按类型分别放到不同的文件夹中。这样就非常便于管理了。
再然后，写的代码多了，会发现很多js文件其实是可以复用的，只要大家按照统一的标准设计，只要稍微看一下文档就能指导别人写的js文件怎么用了。于是就会又很多的包，就是别人写好的js文件。
大家互相分享的包越来越多，有些还是基于别人写好的包的功能，又写一些包，这就存在了依赖关系。错综复杂，这时候就非常需要一个包管理工具。node.js是最流行的一个。node.js收集了人们写好的各种包。
我们使用node.js下载下来就能使用，并且他还帮我们做好了分类，同时也会下载依赖的包。这样使用起来就非常方便。
但是前端工程师觉得还不够，因为他们虽然又很多包可以用。但是，他们还想让自己编写的跟业务相关的js、css、html再发布的能够足够小。这样别人访问的时候就会很快。于是有了webpack，帮助前端工程师打包压缩（就是将不必要的字符，和过长的变量名都修改，只有计算机能容易看懂）自己写的各种文件，甚至是图片。当然webpack也是依赖于node.js的，因为他也需要node.js为他提供的其他包。
随着业务的增长，前端工程师写的代码也会出现难以察觉的bug，找bug成了他们的日常。他们不想每次都刷新页面，他们不想每次都执行webpack的压缩文件的命令。他们是在太懒了。
但是这样做的目的就是，将注意力集中到业务逻辑中。
node.js简单使用
安装：
- 安装
nvm（node.js version manager）linux版，node.js也是不断的迭代新功能和修复新bug，然而有些项目使用的旧的node.js，并且和最新的node.js不兼容，这时候，就需要同一个环境中有多个node.js版本。类似于python中的envvirtual和pipenv一样，都是创建虚拟的环境，便于切换。安装途径：github教程，没有人比官方人员更懂得安装自己的东西了。 - 你终于下载好了nvm，修改源，就是从哪里下载那些
js包。由于总所周知的原因，速度很慢，推荐使用淘宝的源（大公司就是不一样，我要用，我就自己随时同步node.js的源，然后自己做一个node的源）。参考修改方法：bing搜索（抵制baidu，从入门抓起） npm(node.js package manager)，node.js包管理工具。注意：nvm是管理不同版本的node.js，npm是管理node.js中的包。nvm切换的就是不同的npm的版本。当然nvm本身也在更新，在上一步中你也许会看到cnpm，这是淘宝做的一个命令行工具，可以用来直接替代npm，当然其实你修改npm的源也行。
使用
没有人比官网更懂自己的产品了，bing搜索
# 创建一个node.js前端项目（需要手动创建一个文件夹）
npm init
# 其他命令简介
npm install # 默认会下载package.json中保存的依赖包
npm install --save serve # 安装serve并保存到package.json中
npm install --save-dev webpack # 安装wekpack并保存到package.json中,与--save 的区别是,这是安装开发环境的依赖中,正式环境不需要.(dev-development)
npm install -g webpack # 安装到全局环境，只要nvm切换到当前的node.js版本，那么
npm uninstall webpack # 卸载webpack
npm --help
然后你会看见一个package.json，这是node.js的核心配置文件,请简单参考官网说明其中的字段的含义：package.json
到此，使用node.js创建一个前端项目就结束了。没想到吧。
接下来要做的就是，你需要node.js有哪些包可以用(这一点，需要经验才能熟练，不用着急)，如何提高效率。下面就给出一个案例吧。
mkdir node-demo
cd node-demo
npm init # 初始化一个node.js项目，有些参数需要设置，也就是package.json中的字段，加 -y 表示默认设置
# 在执行之前，先看看package.json中的内容，执行后对比一下
npm install --save-dev serve # 安装一个前端项目的启动服务。
执行完npm install --save-dev serve，检查一下，发现多了devDependencies字段，并多了一个serve包。以后别人拿到项目执行npm install的时候就会自动安装了（前端工程师非常骄傲，太特么方便了！）。
然后创建一个页面index.html，默认会打开index的文件，你可以参考：package.json
万事具备，使用serve执行就行了。但是还有一点注意。如果你的npm是最新版本的：npx serve就能直接执行。
如果是Node 8.2/npm 5.2.0以下，就需要到node_modules中的执行serve：./node_modules/.bin/serve,或者修改package.json中的script字段：
"scripts": {
"start": "serve"
}
再执行：npm run start即可。
总结：本文讲了：nvm、npm、node.js的关系。安装，常用命令、
packages.json文件、node_modules、以及常用命令。
