共计 5558 个字符,预计需要花费 14 分钟才能阅读完成。
首先,要先在这里分享一下我的喜悦,从昨天开始其实始终都在喜悦当中的,我收到了我的第一份 offer,这感觉不摆了,比第一桶金都还难受,尽管我还没收到第一桶金哈哈,不过 offer 都得了应该也快了。
明天的内容有点小多,容我缓缓道来
1.
首先咱们看到包的治理配置文件以及下包慢的问题,在咱们多人合作下,是不是要常常把本人的代码共享进来通过 git、github 之类的,那么我应该发现一个问题,一个我的项目文件,有 30M 大小,而代码只有区区 2M 左右的内存,残余的都给谁了?都给了第三方包也就是 node_modules 外面的内容,所以为了轻量化,咱们在共享代码的时候必定是不能带 node_modules 这个文件夹的,把她扔进.gitignore 文件外面疏忽掉,那咱们没有了第三方包的依赖怎么执行代码呢,第三方包必定还是要的,没有怎么能行,咱们有一个 package.json 的文件在这外面寄存了装置的所有的第三方包的内容。
1.1
疾速创立 packagejson
只须要在我的项目的文件中执行 node init -y
要留神一下,只能在英文目录上来创立这个文件,这里的英文是当前目录为英文,也就是上一级为中文都没的关系,而后就是当咱们运行 npm i 装置第三方包的时候就会把信息给到这个 json 文件中,所以咱们在装置前要先创立 json 文件。
1.2
dependencies 节点
这是这个 json 外面的节点名,记录了 npm 装置了哪些包
1.3
既然咱们没有包,又晓得了所有须要的包名,那么怎么来一次性装置所有的包?
npm install 或者 i 不增加包名即可装置所有的包
1.4
卸载包
npm uninstall 包名没有简写
1.5
devDependencies 节点
这个节点也是保留的装置的包,有些包是咱们在我的项目开发过程中才会用到,而有些包使咱们开发上线都会用到的包,咱们个别把前者放在 devDependencies 节点外面,把后者放在 dependencies 节点外面。
当然他也有特定的装置形式
npm i 包名 -D
2.
而后咱们看到下包会慢的一些起因,是因为咱们的 npm 的服务器是国外的,通过海底光缆传过来的数据当然慢,所以这个时候咱们须要把 npm 的镜像服务器换掉,通过 npm config set registry 能够查看以后 npm 的服务器
再通过 npm config set registry=’ 淘宝或者腾讯的镜像地址 ’ 就能够设置过去了。
之所以粗略带过,是因为咱们有简便办法,通过 npm 先装置一个 nrm 全局可用工具,全局就须要在包名前面增加一个 -g
而后 nrm ls 可查看以后可设置的服务器地址,再用 nrm use 加这个服务器名字即可应用。
3.
包的分类
咱们把包分为两大类,一个是我的项目包,就是被装置到 node_modules 外面的包,这外面又有开发依赖包放在 devDependencies 节点外面的和外围依赖包开发上线都用失去的,
二个是全局包,放在 c 盘目录上面的,装置的时候通过 - g 参数装置的。
留神一下:只有工具性质的包才有全局装置的必要,因为他们提供了终端的一些命令
3.1
i5ting_toc
能够把 md 文件转换为 html 的小工具,留神是工具,这个其实挺不便的,后面始终用的 Markdownpad2。
怎么来应用呢?
i5ting_toc -f md 文件门路 - o 示意浏览器关上
3.2
一个标准包的构造必须要蕴含三个货色
①每个包必须是独自目录
②包的顶级目录下必须蕴含 package.json
③packag.json 必须蕴含 name、version、main 三个属性
接下来咱们就来做一个 属于本人的包:要实现的性能就为:能够格式化日期、能够对 html 中的字符本义为特殊字符又本义回来。
首先要初始化包的根本构造,创立一个包的文件夹,外面放三个文件,index.js、package.json、README.md 别离示意包入口文件、包的配置文件、包阐明文档。
接下来在初始化 package.json 外面的内容,{name:使咱们包的名字到时候 npm 网站上搜寻也是这个名字,所以应用前先去网站看一下有没有重名的,
version:版本号,
main:入口文件,阐明了咱们的导入就为这个文件要留神一下,如果说外界导入的时候只是导入了一个目录,并不是这个 js 文件,那么 node 就会去找这个目录下的 package.json 外面的 main 再去找入口文件,
description: 具体介绍,
keywords:关键字是一个数组,
license:开原许可协定}
接下来就是在 index.js 中定义三个性能的函数了,这里有一个很重要的概念,模块化,咱们的格式化工夫是不是须要一个函数,还要补零是不是又要一个函数,那么这两个函数能够放在一个独自的 js 文件外面,咱们的 html 转为特殊字符、特殊字符返回 html 也须要一个独自的 js 文件,实现过后须要在各自的文件把函数放进 exports 外面,而后 index.js 导入两个 js 文件他此时失去的是一个放有这几个函数的对象,咱们须要通过 es6 语法中的扩大运算法,给她解构进去,就只有逗号分隔的函数了,这里有点绕能够配合代码好好了解下。
// 1. 格式化工夫 | |
function dateFormat(time) {const date = new Date(time) | |
let y = date.getFullYear() | |
let m = getZero(date.getMonth() + 1) | |
let d = getZero(date.getDate()) | |
let h = getZero(date.getHours()) | |
let mm = getZero(date.getMinutes()) | |
let s = getZero(date.getSeconds()) | |
return `${y}-${m}-${d} ${h}:${mm}:${s}` | |
} | |
// 2. 补零函数 | |
function getZero(n) {return n < 10 ? '0' + n : n} | |
// 6.1 共享成员 | |
module.exports = {dateFormat} |
// 4.html 本义函数 | |
function getHtmlCode(htmlStr) { | |
return htmlStr.replace(/<|>|"|&/g, match => {switch(match) { | |
case '<': | |
return '<' | |
case '>': | |
return '>' | |
case '"': | |
return '"' | |
case '&': | |
return '&' | |
} | |
}) | |
} | |
// 5. 还原 html | |
function getHtml(htmlStr) { | |
return htmlStr.replace(/<|>|"|&/g, match => {switch(match) { | |
case '<': | |
return '<' | |
case '>': | |
return '>' | |
case '"': | |
return '"'case'&': | |
return '&' | |
} | |
}) | |
} | |
// 6.2 共享成员 | |
module.exports = { | |
getHtmlCode, | |
getHtml | |
} |
index.js | |
// 6.3 导入 | |
const date = require('./src/dateFormat') | |
const strEscape = require('./src/strEscape') | |
// 3. 共享成员 | |
module.exports = { | |
...date, | |
...strEscape | |
} |
test.js
const bag = require('./index') | |
console.log(bag.dateFormat(new Date())); | |
console.log(bag.getHtmlCode('<h2> 我是一个大温顺" 嘻嘻 "ss&</h2>')); | |
console.log(bag.getHtml('<h2> 我是一个大温顺 " 嘻嘻 "ss&</h2>')); |
3.3
咱们持续看到怎么来编写包的阐明文档,就是把包的作用以及用法,注意事项阐明分明即可
装置
npm i mybag-huang |
导入
const mybag = require('mybag-huang') |
格式化工夫
const time = mybag.dateFormat(new Date()) |
本义 html 代码中的特殊字符
mybag.getHtmlCode('<h2> 我是一个大温顺" 嘻嘻 "ss&</h2>') |
## 本义 html 代码中的失常字符
mybag.getHtml('<h2> 我是一个大温顺 " 嘻嘻 "ss&</h2>') |
开源协定
ISC
3.4
公布包
首先注册 npm 账号,而后登陆 账号是在终端上登录:npm login
而后到所处的包的 目录下 npm pbulish 既能够公布在 npm 网站上,然而要留神一下,须要切回到官网的服务器才可能公布胜利。
删除已公布的包 npm unpublish 包名 –force 只能删除公布后 72 小时内的包,删除后二十四小时内不可再公布雷同的包
4.
模块加载机制
咱们的模块都是优先从缓存当中来加载的,当咱们导入过后就会第一工夫加载在缓存中,所以导入雷同的文件不论你导入多少次,都是加载的第一个文件。
内置模块的加载机制
内置模块加载的优先级最高,比如说内置模块和咱们的自定义模块如果名字一样,那么导入的时候是认为这是一个内置模块的。
自定义模块的加载机制
require 外面的文件必须以./ 或者../ 结尾不然就会被当为内置或者第三方模块。
如果说省略了扩展名,那么 node 会顺次开始查找 js、json、node 的文件扩展名都没有找到就会报错。
第三方模块的加载机制
require 不是内置模块也不是,/ 结尾那么就会从当前目录的 modules 文件夹外面开始照这个第三方模块而且没找到的话会持续往上一级找,直到找到根目录为止。
当你把目录作为 require 的门路时,会首先去找 package 外面的 main 如果没有指定,就会加载当前目录下的 index.js 都没有就会报错。
5.
express
5.1
首先什么叫做 express
他和 http 内置模块雷同,专门创立 web 服务器的
5.2
根本应用
1. 装置
npm i express
2. 创立 web 服务器
①导入 express
②创立服务器
const app = express()
③diaoyong
app.listen(端口号,回调函数)
3.
监听 get、post
app.get/post(url,回调函数)
// 1. 导入 | |
const express = require('express') | |
// 2. 创立服务器 | |
const app = express() | |
// 4. 监听客户端的 get 和 post 申请并响应 | |
app.get('/index.html', (req, res) => { | |
res.send({ | |
"name" : "zs", | |
"sex" : "男", | |
"age" : 19 | |
}) | |
}) | |
app.post('/index', (req, res) => res.send('post 胜利')) | |
// 3. 开启服务器 | |
app.listen(80, () => { | |
console.log('express server running at http://127.0.0.1') | |
}) |
4
获取 url 中的参数
通过 req.query 取得一个对象保留的参数
const express = require('express') | |
const app = express() | |
app.get('/', (req, res) => {res.send(req.query) | |
}) | |
app.listen(80, () => {console.log('express server running at http://127.0.0.1'); | |
}) |
获取 url 当中的动静参数
req.params
const express = require('express') | |
const app = express() | |
app.get('/:id', (req, res) => {console.log(req.params); | |
}) | |
app.listen(80, () => {console.log('express server running at http://127.0.0.1'); | |
}) |
5.3
托管动态资源
express.static()这个办法能够创立动态服务器的时候,将文件目录下的 css、图片、js 等共享进来对外开放。
app.use(express.static(‘ 文件夹 ’))要留神一点对谁凋谢那么这个目录是不会呈现在 url 门路当中的
const express = require('express') | |
const app = express() | |
app.use(express.static('./clock')) | |
app.listen(80, () => console.log('express server running at http://127.0.0.1')) |
如果要托管多个目录就把代码执行屡次即可,然而要留神如果拜访的文件名有几个目录都有的话,会依照程序执行后面的。
挂在门路前缀
const express = require('express') | |
const app = express() | |
app.use('/abc',express.static('./clock')) | |
app.listen(80, () => console.log('express server running at http://127.0.0.1')) |
5.4
明天最初的内容更新一个很实用的小工具,nodemon 间接全局装置,他的作用就是咱们平时改了一下代码,比方服务器必须从新断开从新连贯,才会看到成果就会很麻烦,而有了这个工具后间接执行 nodemon 文件名他就会检测到咱们的代码批改状况主动去重新启动,就跟咱们 html 的 live 一样