2018年第33周-javeer对nodejs体会

摘要：流程源处理源代码，例如过滤任何值。工艺类从编译后处理生成的文件，例如对类进行字节码增强。整合后的测试执行集成测试后执行所需的操作。校验运行任何检查以验证包装是否有效并符合质量标准。

nodejs的语法和es6不一样，如模块系统，一个是CommonJS的require、一个是es6的import，写模块也不一样。

我来理解，nodejs类似与java的jvm，所以执行js时是这样，假设文件server.js

node server.js

而npm，类似与java的maven，项目构建工具，既然是构建工具，就需要配置文件，maven的配置文件是pom.xml，则npm的配置文件时package.json，一个是xml一个是json。
npm初始化package.json文件:

npm init -f

如安装常用的 Node.js web框架模块 express依赖，这个类似于php需要什么功能时，就安装模块什么一样的。

npm install express -g  

全局安装

将安装包放在 /usr/local 下或者你 node 的安装目录。

可以直接在命令行里使用。

npm install express

本地安装

将安装包放在 ./node_modules 下（运行 npm 命令时所在的目录），如果没有 node_modules 目录，会在当前执行 npm 命令的目录下生成 node_modules 目录。

可以通过 require() 来引入本地安装的包。

安装模块到项目node_modules目录下。

不会将模块依赖写入devDependencies或dependencies 节点。

运行 npm install 初始化项目时不会下载模块。

安装模块到全局，不会在项目node_modules目录中保存模块包。

不会将模块依赖写入devDependencies或dependencies 节点。

运行 npm install 初始化项目时不会下载模块。

安装模块到项目node_modules目录下。

会将模块依赖写入dependencies 节点。

运行 npm install 初始化项目时，会将模块下载到项目目录下。

运行npm install --production或者注明NODE_ENV变量值为production时，会自动下载模块到node_modules目录中。

安装模块到项目node_modules目录下。

会将模块依赖写入devDependencies 节点。

运行 npm install 初始化项目时，会将模块下载到项目目录下。

运行npm install --production或者注明NODE_ENV变量值为production时，不会自动下载模块到node_modules目录中。

devDependencies 节点下的模块是我们在开发时需要用的，比如项目中使用的 gulp ，压缩css、js的模块。这些模块在我们的项目部署后是不需要的，所以我们可以使用 -save-dev 的形式安装。像 express 这些模块是项目运行必备的，应该安装在 dependencies 节点下，所以我们应该使用 -save 的形式安装。

既然npm类似maven，那么webpack类似什么，虽然很难完全匹配上java的知识，但也尽量匹配下，方便理解。
首先先回顾，maven是有三类生命周期（默认（default），清洁（clean）和站点（site）生命周期），我们常用的是默认生命周期，这生命周期包含多个阶段(参考)：

验证（validate）    验证项目是正确的，所有必要的信息可用。  
初始化（initialize）    初始化构建状态，例如设置属性或创建目录。  
产生来源（generate-sources）    生成包含在编译中的任何源代码。  
流程源（process-sources）    处理源代码，例如过滤任何值。  
生成资源（generate-resources）    生成包含在包中的资源。  
流程资源（process-resources）    将资源复制并处理到目标目录中，准备打包。  
编译（compile）    编译项目的源代码。  
工艺类（process-classes）    从编译后处理生成的文件，例如对Java类进行字节码增强。  
生成测试来源（generate-test-sources）    生成包含在编译中的任何测试源代码。  
流程测试来源（process-test-sources）    处理测试源代码，例如过滤任何值。  
生成测试资源（generate-test-resources）    创建测试资源。  
流程测试资源（process-test-resources）    将资源复制并处理到测试目标目录中。  
测试编译（test-compile）    将测试源代码编译到测试目标目录中  
流程检验类（process-test-classes）    从测试编译中处理生成的文件，例如对Java类进行字节码增强。对于Maven 2.0.5及以上版本。  
测试（test）    使用合适的单元测试框架运行测试。这些测试不应该要求代码被打包或部署。  
制备包（prepare-package）    在实际包装之前，执行必要的准备包装的操作。这通常会导致打包的处理版本的包。（Maven 2.1及以上）  
打包（package）    采取编译的代码，并以其可分发的格式（如JAR）进行打包。  
预集成测试（pre-integration-test）    在执行集成测试之前执行所需的操作。这可能涉及诸如设置所需环境等。  
集成测试（integration-test）    如果需要，可以将该包过程并部署到可以运行集成测试的环境中。  
整合后的测试（post-integration-test）    执行集成测试后执行所需的操作。这可能包括清理环境。  
校验（verify）    运行任何检查以验证包装是否有效并符合质量标准。  
安装（install）  将软件包安装到本地存储库中，以作为本地其他项目的依赖关系。  
部署（deploy）    在集成或发布环境中完成，将最终软件包复制到远程存储库，以与其他开发人员和项目共享。

每个阶段都是对应有默认插件去执行的，其中“package”阶段是最经常修改的，如：

    maven-assembly-plugin
    
        src/main/assembly/dep.xml
    
    
        
            create-archive
            package
            
                single
            
        
    

记起了maven这些阶段，就很好理解webpack、gulp、grunt，它们就是一套构建阶段的工具，最终呈现出的效果就是打包。既然maven可以自定义阶段的插件，那么nodejs，也可以指定不同的构建工具。
讲到这里，webpack、gulp、grunt可以类比为maven的阶段，也可以类比为maven、ant、gradle不同的构建工具。

安装webpack（全局）,注意：webpack 4.X 开始，需要安装 webpack-cli 依赖 ,所以使用这条命令 npm install webpack webpack-cli -g

  npm install webpack webpack-cli -g

查看webpack版本

gucci@gucci-PC:~$ webpack -v
4.16.5

如vue脚手架vue-cli，详情参考https://www.npmjs.com/package...
学习webpack时，发现配置文件超多的，再结合vue，那配置就无穷无尽了。从零开始写配置文件就不靠谱了。所以就出现脚手架scaffolding，这跟maven的archetype很像，因为不只是vue，react也是有脚手架。
安装vue脚手架（全局）

npm install --global vue-cli

查看版本：

gucci@gucci-PC:~$ vue -V
2.9.6

新建项目

gucci@gucci-PC:/mydata/test$ vue init webpack jc-demo-vue-cli

? Project name jc-demo-vue-cli
? Project description A Vue.js project
? Author JevonCode 
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner jest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recommended) no

   vue-cli · Generated "jc-demo-vue-cli".

# Project initialization finished!
# ========================

To get started:

  cd jc-demo-vue-cli
  npm install (or if using yarn: yarn)
  npm run lint -- --fix (or for yarn: yarn run lint --fix)
  npm run dev
  
Documentation can be found at https://vuejs-templates.github.io/webpack

安装（下载）依赖

npm install

注：如果npm出现异常，就用cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org

会发现，人们说的js技术迭代快，学不过来，但从我们后端开发人员来看，会发现其很多思想是来源于后端思想。如构建、模块化等思想。计算机先驱Alan Jay Perlis曾说过“如果一种语言不能影响你的编程思路，那就不值得学习。”

A language that doesn"t affect the way you think about programming is not worth knowing.

虽然前端很多思想源于后端，但其也是有其思想，也影响后端（我说的是个人学习，而不是技术的发展）。如函数编程，java的lambda等。js最先给我体会就是hack精神，利用现有语法完成其语法不支持的部分。学了ES6，发现根本就“没有规则”，还想说做个笔记记录下，最后发现根本就把整本书抄了下来，看来只能自己记住个大概，然后实际使用时再翻开来仔细看看。