前言，想要进一步学习前端，对于相关概念进行一次梳理。
NodeJS
首先就是NodeJS，简单来说 NodeJS 就是运行在服务端的 JavaScript。从这句话可以推断出，初始情况下的JavaScript时运行在浏览器上的一门编程语言，浏览器内置了可以运行JS的引擎。所以，我们在本地上跑JS，学习JS代码，只能运行在浏览器的开发者工具上面。而不能像Python一样直接，运行在cmd上面。从这角度来看，Python本身就是运行在服务端的语言，或者说就是后端的语言。而NodeJs的出现，使得原先只能在前端上运行的JS语言，变成了，可以运行在后端的语言。这算是一项开创性的举动，大大增大了前端的工作范围，同时也加重了前端的话语权。
对于老牌后端来说，例如Java。NodeJS作为后端上，体量太小，只能在小型项目中工作，不会威胁到后端地位。被分去的后端任务也只是可有可无的一些东西。
但是对于前端来说，这是一次契机，能够加入整个项目运行的流程中，自身能够形成一个逻辑闭环，解决了之前轻逻辑重脑力的低技术局面。
类比Python运行相关文件，这里把Node一些基础命令列举出来，构建基础的Node概念。
在使用 Node.js 之前，首先需要进行安装，在官网下载安装包安装
node -v 查看当前Node版本
node test.js 运行js文件
交互模式
打开终端，键入node进入命令交互模式，可以输入一条代码语句后立即执行并显示结果。
NPM 介绍
NPM是随同NodeJS一起安装的包管理工具，能够解决NodeJS代码部署上的很多问题，常见的使用常见有以下几种：
- 允许用户从NPM服务器下载别人编写的第三方包到本地使用
- 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用
- 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用
类比Python，npm就相对于pip，都是各自语言的包管理工具。
npm 安装Node.js模块语法格式如下：
npm install <Modul Name>
例如 npm install express
安装好之后，express包就放在工程目录下的 node_modules目录中，因此在代码重只需要通过require('express')的方式就好，无需指定第三方包路径
var express = require('express')
全局安装和本地安装
npm 的包安装分为本地安装(local)、全局安装(global)两种，从敲的命令行来看，差别只是有没有-g而已，例如
npm install express
npm install express -g
1、 本地安装
- 将安装包放在 ./node_modules 下（运行 npm 命令时所在的目录），如果没有 node_modules 目录，会在当前执行 npm 命令的目录下生成 node_modules 目录。
- 可以通过 require() 来引入本地安装的包。
2、全局安装 - 将安装包放在 /usr/local 下或者你 node 的安装目录。
- 可以直接在命令行里使用。
总结：全局安装，可以直接在命令行中使用，本地安装，需要引入。类似Python全局环境与虚拟环境。
Webpack
Webpack可以看作是模块打印机：它做的事情是，分析你的项目结构，找到JavaScript模块以及其他的一些浏览器不能直接允许的拓展语言(Scss,TypeScript等), 并将其转换和打包为合适的格式供浏览器使用。
为什么要使用WebPack
现如今的很多网页其实可以看作是功能丰富的应用，它们拥有着复杂的JavaScript代码和一大堆依赖包。为了简化复杂的开发环境，前端社区涌现出了很多好的实践方法。
- 模块化，让我们可以把复杂的程序细化为小的文件。
- 类似于TypeScript这种在JavaScript基础上拓展的开发语言：使我们能够实现目前版本的JavaScript不能直接使用的特性，并且之后还能转换为JavaScript文件使浏览器可以识别。
- Scss，less等CSS预处理器
- ...
这些改进确实大大的提高了我们的开发效率，但是利用它们开发的文件往往需要进行额外的处理才能让浏览器识别，而手动处理又是非常繁琐的，这就为WebPack类的工具的出现提供了需求。
babel
JavaScript在不断的发展，各种新的标准和提案层出不穷，但是由于浏览器的多样性，导致可能几年之内都无法广泛普及，bebel可以让你提前使用这些语言特性，它是一种意图很多的JavaScript编译器，它把最新版的JavaScript编译成当下可以执行的版本。简言之，利用babel就可以将es6或es7中新加入的新特性，转化为当前你使用的es5版本的语法。
网友评论