Nodejs Vue

2018-10-01

work

Jekyll Usage

图片增加title和link

处理为——

<figure class="image">
    <figcaption>{{ include.description }}</figcaption>
    {% if include.link %}
    <a href="{{ include.link }}" target="_blank"><img src="{{ include.url }}" alt="{{ include.description }}"> </a>
    {% else %}
    <img src="{{ include.url }}" alt="{{ include.description }}">    
    {% endif %}    
</figure>

文章文件命名规范

Jekyll requires blog post files to be named according to the following format:

YEAR-MONTH-DAY-title.MARKUP

Where YEAR is a four-digit number, MONTH and DAY are both two-digit numbers, and MARKUP is the file extension representing the format used in the file. After that, include the necessary front matter. Take a look at the source for this post to get an idea about how it works.

Jekyll also offers powerful support for code snippets:

{% highlight ruby %}
def print_hi(name)
  puts "Hi, #{name}"
end
print_hi('Tom')
#=> prints 'Hi, Tom' to STDOUT.
{% endhighlight %}

{% highlight java %}
public static void main(String[] args) {
    System.out.println("Welcome to Mixin 101");
}
{% endhighlight %}

链接方法

Check out the Jekyll docs for more info on how to get the most out of Jekyll. File all bugs/feature requests at Jekyll’s GitHub repo. If you have questions, you can ask them on Jekyll Talk.

Use Dashboard to Go Deeper, Not Wider

重学前端

# 7 种基本类型
Undefined； 
Null； 
Boolean； 
Striing;
Number;
Symbol;
Object

#  7 种语言类型
List 和 Record： 用于描述函数传参过程。 
Set：主要用于解释字符集等。
Completion Record：用于描述异常、跳出等语句执行过程。
Reference：用于描述对象属性访问、delete 等。
Property Descriptor：用于描述对象的属性。
Lexical Environment 和 Environm Record：用于描述变量和作用域
Data Block：用于描述二进制数据。

Window env

安装完成后，自带npm目录，可以在安装目录的/nodejs/node_modules/npm/html/doc/index.html查看帮助文档

npm -l 

npm <command> -h  quick help on <command>
npm -l            display full usage info
npm help <term>   search for help on <term>
npm help npm      involved overview

Specify configs in the ini-formatted file:
    C:\Users\joechin\.npmrc
or on the command line via: npm <command> --key value
Config info can be viewed via: npm help config

npm@6.4.1 C:\Program Files\nodejs\node_modules\npm

配置国内repository

临时使用npm --registry https://registry.npm.taobao.org install express
持久使用 npm config set registry https://registry.npm.taobao.org
通过cnpm使用npm install -g cnpm --registry=https://registry.npm.taobao.org

使用cnpm进行安装 cnpm install express

配置后可通过下面方式来验证是否成功

# 查看配置的repository信息
npm config get registry
# View registry info for express
npm info express
# default registry
➜  ~ npm config get registry 
https://registry.npmjs.org/
➜  ~ npm config set registry https://registry.npm.taobao.org
➜  ~ npm config get registry                                
https://registry.npm.taobao.org/
➜  ~ npm install --global vue-cli

# save to app.js, then: node app.js
# visit http://localhost:3000, and you will see a message 'Hello World'
const http = require('http');

const hostname = '127.0.0.1';
const port = 3000;

const server = http.createServer((req, res) => {
  res.statusCode = 200;
  res.setHeader('Content-Type', 'text/plain');
  res.end('Hello World\n');
});

server.listen(port, hostname, () => {
  console.log(`Server running at http://${hostname}:${port}/`);
});

Version规则

SemVer
NPM使用语义版本号来管理代码：MAJOR,MINOR.PATCH
MAJOR：这个版本号变化了表示有了一个不可以和上个版本兼容的大更改。
MINOR：这个版本号变化了表示有了增加了新的功能，并且可以向后兼容。
PATCH：这个版本号变化了表示修复了bug，并且可以向后兼容。

"dependencies": {
    "bluebird": "^3.3.4", //>=3.3.4 <4.0.0
    "body-parser": "~1.15.2" // >=1.15.2 <1.16.0  
}

波浪符号（~）：更新到当前minor version中最新的版本。body-parser:~1.15.2，这个库会去匹配更新到1.15.x的最新版本，如果出了一个新的版本为1.16.0，则不会自动升级。

插入符号（^）：更新到当前major version中最新的版本。bluebird:^3.3.4，这个库会去匹配3.x.x中最新的版本，但是他不会自动更新到4.0.0。

波浪符号是曾经npm安装时候的默认符号，现在已经变为了插入符号。

guides

Don’t Block the Event Loop (or the Worker Pool)

Event Loop:
the Event Loop executes the JavaScript callbacks registered for events, and is also responsible for fulfilling non-blocking asynchronous requests like network I/O.

Worker Pool:

I/O-intensive
1. DNS: dns.lookup(), dns.loopupService.
2. File System:All file system APIs except fs.FSWatcher() and those that are explicitly synchronous use libuv’s threadpool.
CPU-intensive
1. Crypto: crypto.pbkdf2(), crypto.scrypt(), crypto.randomBytes(), crypto.randomFill(), crypto.generateKeyPair().
2. ZlibAll zlib APIs except those that are explicitly synchronous use libuv’s threadpool.

require 模块

1. 如果 X 是内置模块
   a. 返回内置模块
   b. 停止执行
2. 如果 X 以 '/' 开头
   a. 设置 Y 为文件根路径
3. 如果 X 以 './' 或 '/' or '../' 开头
   a. LOAD_AS_FILE(Y + X)
   b. LOAD_AS_DIRECTORY(Y + X)
4. LOAD_NODE_MODULES(X, dirname(Y))
5. 抛出异常 "not found"

LOAD_AS_FILE(X)
1. 如果 X 是一个文件, 将 X 作为 JavaScript 文本载入并停止执行。
2. 如果 X.js 是一个文件, 将 X.js 作为 JavaScript 文本载入并停止执行。
3. 如果 X.json 是一个文件, 解析 X.json 为 JavaScript 对象并停止执行。
4. 如果 X.node 是一个文件, 将 X.node 作为二进制插件载入并停止执行。

LOAD_INDEX(X)
1. 如果 X/index.js 是一个文件,  将 X/index.js 作为 JavaScript 文本载入并停止执行。
2. 如果 X/index.json 是一个文件, 解析 X/index.json 为 JavaScript 对象并停止执行。
3. 如果 X/index.node 是一个文件,  将 X/index.node 作为二进制插件载入并停止执行。

LOAD_AS_DIRECTORY(X)
1. 如果 X/package.json 是一个文件,
   a. 解析 X/package.json, 并查找 "main" 字段。
   b. let M = X + (json main 字段)
   c. LOAD_AS_FILE(M)
   d. LOAD_INDEX(M)
2. LOAD_INDEX(X)

LOAD_NODE_MODULES(X, START)
1. let DIRS=NODE_MODULES_PATHS(START)
2. for each DIR in DIRS:
   a. LOAD_AS_FILE(DIR/X)
   b. LOAD_AS_DIRECTORY(DIR/X)

NODE_MODULES_PATHS(START)
1. let PARTS = path split(START)
2. let I = count of PARTS - 1
3. let DIRS = []
4. while I >= 0,
   a. if PARTS[I] = "node_modules" CONTINUE
   b. DIR = path join(PARTS[0 .. I] + "node_modules")
   c. DIRS = DIRS + DIR
   d. let I = I - 1
5. return DIRS

exports module.exports

node module
如果要对外暴露属性或方法，就用 exports 就行，要暴露对象(类似class，包含了很多属性和方法)，就用 module.exports。

install –save

-save和save-dev可以省掉你手动修改package.json文件的步骤。
npm install module-name -save 自动把模块和版本号添加到dependencies部分
npm install module-name -save-dve 自动把模块和版本号添加到devdependencies部分

package-lock package.json

锁定安装时的包的版本号，以保证其他人在npm install时大家的依赖能保证一致。
source

使用npm install xxx命令安装模块时，不再需要–save选项，会自动将模块依赖信息保存到 package.json 文件；
安装模块操作（改变 node_modules 文件夹内容）会生成或更新 package-lock.json 文件
发布的模块不会包含 package-lock.json 文件
如果手动修改了 package.json 文件中已有模块的版本，直接执行npm install不会安装新指定的版本，只能通过npm install xxx@yy更新

install error: Unexpected end of JSON input

issue
npm install error: Unexpected end of JSON input while parsing near ‘…edc4cd”,“size”:396934’ solution: npm cache clean –force

多版本管理

node 多版本控制

安装nvm

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash

或者 Wget:

wget -qO- https://raw.githubusercontent.com/creationix/nvm/v0.33.2/install.sh | bash

查看可用版本

# lts long-time-stable
nvm ls-remote --lts

安装指定版本： nvm install v8.12.0
切换到指定版本 nvm use v8.12.0

删除nvm
默认会安装到 $HOME/.nvm 文件夹下 + 更新了环境变量。反向操作即可。

nrm 管理镜像

安装nrm
$ npm install -g nrm

列出可用镜像
$ nrm ls

使用淘宝镜像
$ nrm use taobao

npm ERR! Cannot read property ‘match’ of undefined 错误处理

Cannot read property ‘match’ of undefined

# first just 
rm package-lock.json
# if it doesn't work
rm -rf node_modules
rm package-lock.json
npm cache clear --force
npm install

Request to https://bower.herokuapp.com/packages/ failed with 502

bower issue

phantomjs配置

使用npm install的时候，可以看到会进行phantomjs的安装，有类似如下信息——

这个包phantomjs 实际上是一个“可执行的包”，作用为 An NPM installer for [PhantomJS](http://phantomjs.org/), headless webkit with JS API

受限于网络环境，下载比较缓慢，可以进行本地安装。然后将bin目录加入$PATH即可。 export PATH=/Users/gebitang/phantomjs-2.1.1-macosx/bin:$PATH
如何有本地的私有源，也可以通过npm进行配置 npm config set phantomjs_cdnurl http://npm.stf.demo.com/mirrors/phantomjs/ -g phantomjs If github is down, or the Great Firewall is blocking github, you may need to use a different download mirror. To set a mirror, set npm config property phantomjs_cdnurl.

更详细介绍——README.md

使用 npm config list查看配置的默认变量

dashboard