前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >Node.js 极简笔记

Node.js 极简笔记

作者头像
张哥编程
发布2024-12-19 09:34:13
发布2024-12-19 09:34:13
20100
代码可运行
举报
文章被收录于专栏:云计算linux云计算linux
运行总次数:0
代码可运行

Node.js

一.Node基础

概念:Javascript运行时平台,不是语言,也不是框架,是一个平台。

1.1 what is node ?

  • Node.js 是一个基于Chrome V8 引擎的JavaScript运行环境
  • Node.js使用了一个事件驱动、非阻塞式I/O的模型,使其轻量又高效
  • Node.js的包管理工具npm,是全球最大的开源库生态系统
  • 官网 http://nodejs.cn/
  • npm 插件官网:https://www.npmjs.com/

1.2作用

1.3为什么学习?

1.4 常见问题

  • Python环境丢失
  • Node中有些第三方的包是以C/C++源码的方式发布的,需要安装后编译,确保全局环境中可以使用python命令,python 版本推荐2.7.0
  • 环境变量丢失
  • 部分电脑安装完毕之后没有环境变量需要手动配置
  • Windows中环境变量分为系统变量和用户变量
  • 环境变量的变量名是不区分大小写的
  • PATH 变量:只要添加到 PATH 变量中的路径,都可以在任何目录下
  • 目的可以在任何地方调起node命令

1.4 案例:操作步骤

Hello.js

1.编写js文件

2.定位到目录

3.输入node xxx.js,解释执行

代码语言:javascript
代码运行次数:0
运行
复制
let str="hello world"

console.log(str)
console.log(window)  //没有bom
console.log(document) //没有dom

多出来的功能:

代码语言:javascript
代码运行次数:0
运行
复制
//1.定义导入包
let fs=require('fs')
//2.读取hello.js
//参数:路径,匿名函数
fs.readFile('hello.js',function (error,data) {
    console.log(data);//utf-8编码
    console.log(data.toString());  //格式可以输出 
})

输出的格式不是ASCI编码格式,注意!!!

关于参数的代码理解

代码语言:javascript
代码运行次数:0
运行
复制
//1.定义导入包
let fs=require('fs')
//2.读取hello.js
//参数:路径,匿名函数
fs.readFile('hello2.js',function (error,data) {
    // if(error==null)
    //     console.log('没有错误')
    if(error)
        console.log('读取文件失败!')
    else
        console.log(data.toString());
})

1.5 http服务

代码语言:javascript
代码运行次数:0
运行
复制
//1.导入http包
let http=require('http')
//2.定义server变量,返回一个server实例;
let server=http.createServer()
//3.服务器的响应,接受request请求,产生会回调事件
server.on('request',function () {
    console.log('接受来自客户端的请求....')
})
//4.绑定到响应的端口号;
server.listen(3000,function () {
    console.log('服务器启动了,可以通过http://localhost:3000/来访问...')
})
代码语言:javascript
代码运行次数:0
运行
复制
//1.导入http包
let http=require('http')
//2.定义server变量,返回一个server实例;
let server=http.createServer()
//3.服务器的响应,接受request请求,产生会回调事件
//增加参数:request、response
server.on('request',function (request,response) {
    console.log('接受来自客户端的请求....')
    console.log('请求路径是:'+request.url)
    //response:响应输出;服务器发送给客户端
    response.write('你好')
    response.write('test...aaa')
    response.end()
})
//4.绑定到响应的端口号;
server.listen(3000,function () {
    console.log('服务器启动了,可以通过http://localhost:3000/来访问...')
})

根据不同的url返回不同的服务

let url=request.url

url返回的是/之后的路径

代码语言:javascript
代码运行次数:0
运行
复制
//1.导入http包
let http=require('http')
//2.定义server变量,返回一个server实例;
let server=http.createServer()
//3.服务器的响应,接受request请求,产生会回调事件
//增加参数:request、response
server.on('request',function (request,response) {
    console.log('接受来自客户端的请求....')
    console.log('请求路径是:'+request.url)
    //3.1获取请求的url路径信息;
    let url=request.url
    console.log('----'+url)
    //接下来,根据url进行判断;
    if(url=='/'){
        response.end('index.html')
    }else if(url=='/login'){
        response.end('login.html')
    }else if(url=='/products'){
        let products=[
            {name:'苹果',price:4.5},
            {name:'香蕉',price:3.5},
            {name:'橘子',price:2.5}]
        response.end(JSON.stringify(products))
    }
    else{
        response.end('404 Error')
    }
    //response:响应输出;服务器发送给客户端
    // response.write('你好')
    // response.write('test...aaa')
    // response.end()
})
//4.绑定到响应的端口号;
server.listen(3000,function () {
    console.log('服务器启动了,可以通过http://localhost:3000/来访问...')
})

二.模块

模块分为三种:

  1. 内置模块
  2. 自定义模块
  3. 第三方模块

2.1 内置模块

之前代码require(‘fs’)就是引用的内置模块。Node为JS提供了很多服务器级别的API,这些API绝大多数都被包装到了一个有名字的核心模块。例如文件操作的fs模块。

使用格式:

let 变量名=require(‘模块名’) //fs:文件读写模块

let http=require(‘http’) //http:协议模块;

let path=require(‘path’) //路径处理模块

let os=require(‘os’)

let fs=require(‘fs’)

2.1.1.文件夹的操作

代码语言:javascript
代码运行次数:0
运行
复制
let fs = require("fs");
//创建文件夹
//fs.mkdir('./hello',(err,data)=>{
// console.log(err);
// console.log(data);
//});

//修改文件夹
//fs.rename('./hello','./testyyh',(err)=>{
// if(err){
//    console.log("error");
// }else{
//    console.log("ok");
// }
//});
//删除文件夹-->只能删除空文件夹
fs.rmdir('./testyyh',(err)=>{
    if(err){
        console.log('删除失败');
        console.log(err);
    }else{
        console.log('ok');
    }

2.1.2 文件的操作

代码语言:javascript
代码运行次数:0
运行
复制
const   fs = require('fs');
//创建文件,覆盖写入,正常的话则是追加
//fs.writeFile('test.txt','这是我的第一个文件',(err)=>{
// if(err){
//    console.log('创建失败');
//    console.log(err);
// }else{
//    
//    console.log('创建成功!');
// }
// 
//});
//读取文件,在原来的基础上追加文件
//fs.appendFile('test.txt','韩梅梅你好',(err)=>{
// console.log(err);
//});

//读取文件这是第一种方式
//fs.readFile('test.txt',(err,msg)=>{
// console.log(err);
// console.log(msg.toString("utf8"));//在转化为字符串的时候指定编码方式
//});
//在参数中指定编码方式
//fs.readFile('test.txt','utf8',(err,msg)=>{
// 
// console.log(err);
// console.log(msg);
//});
//删除文件
//fs.unlink('./test.txt',(err)=>{
// console.log(err);
//});

2.1.3 判断是文件还是目录

代码语言:javascript
代码运行次数:0
运行
复制
const fs = require('fs');
fs.readdir('./',(err,dirs)=>{
    for(let index=0;index<dirs.length;index++){
        console.log(dirs[index]);
    }
});
fs.stat('./',(err,stats)=>{
    if(stats.isFile()){

        console.log('是一个文件');
    }else{
        console.log('是一个目录');
    }
});

2.2 自定义模块

详细介绍自定义模块:

创建一个模块(一个js文件就是一个模块),这是test.js

代码语言:javascript
代码运行次数:0
运行
复制
let hellomodule={
    sayhell(){
        console.log("hello world");
    }
}
module.exports=hellomodule

在另外一个文件进行调用

代码语言:javascript
代码运行次数:0
运行
复制
//1.导入文件;必须是./的模式,直接路径不可用;
let testModule=require('./module.js')
//2.直接使用;
console.log(testModule)
testModule.sayhell()

2.3 操作系统

代码语言:javascript
代码运行次数:0
运行
复制
//1.引用os核心模块
let os=require('os')

//2.输出cpu的信息;
console.log(os.cpus())
//内存信息
console.log(os.totalmem())
console.log(os.type)
//.1.1引用path核心模块
let path=require('path')

//2.测试path;
path.extname('c:/soft/oop.java')
//ext:扩展名
console.log(path.extname('c:/soft/oop.java'))
代码语言:javascript
代码运行次数:0
运行
复制
//输出端口号;
console.log('请求端口号:'+request.socket.remotePort)
console.log('请求地址:'+request.socket.remoteAddress)

2.4 http+箭头函数

代码语言:javascript
代码运行次数:0
运行
复制
let http=require('http')

let server=http.createServer()

server.on('request',(req,resp)=>{
    console.log('请求地址:'+req.url)
    console.log('请求客户端地址信息:'+req.socket.remotePort,req.socket.remoteAddress)

    resp.end('hello world.张晨光...')
})

server.listen(5000,()=>{
    console.log('服务器启动可以访问了...')
})

可以启动多个服务,端口号不同就行!!!

2.5 发送文件内容

代码语言:javascript
代码运行次数:0
运行
复制
let http=require('http')
let fs=require('fs')

let server=http.createServer()

server.on('request',(req,resp)=>{
    let url=req.url
    if(url==='/'){
        fs.readFile('./hello.html',(err,data)=>{
            if(err){
                resp.setHeader('Content-Type','text/plain;charset=utf-8')
                resp.end('文件读取失败!')
            }else{
                resp.setHeader('Content-Type','text/html;charset=utf-8')
                resp.end(data)
            }
        })
    }
})

server.listen(3000,()=>{
    console.log('服务器启动可以访问了...')
})

可以读取图片的程序升级

代码语言:javascript
代码运行次数:0
运行
复制
let http=require('http')
let fs=require('fs')

let server=http.createServer()

server.on('request',(req,resp)=>{
    let url=req.url
    if(url==='/'){
        fs.readFile('./hello.html',(err,data)=>{
            if(err){
                resp.setHeader('Content-Type','text/plain;charset=utf-8')
                resp.end('文件读取失败!')
            }else{
                resp.setHeader('Content-Type','text/html;charset=utf-8')
                resp.end(data)
            }
        })
    }
    else if(url==='/photo'){
        fs.readFile('./resources/2a.jpg',(err,data)=>{
            if(err){
                resp.setHeader('Content-Type','text/plain;charset=utf-8')
                resp.end('图片读取失败!')
            }else{
                resp.setHeader('Content-Type','image/jpeg')
                resp.end(data)
            }
        })
    }
})

server.listen(3000,()=>{
    console.log('服务器启动可以访问了...')
})

Http Mime Type

文件扩展名

Content-Type(Mime-Type)

文件扩展名

Content-Type(Mime-Type)

.*( 二进制流,不知道下载文件类型)

application/octet-stream

.tif

image/tiff

.001

application/x-001

.301

application/x-301

.323

text/h323

.906

application/x-906

.907

drawing/907

.a11

application/x-a11

.acp

audio/x-mei-aac

.ai

application/postscript

.aif

audio/aiff

.aifc

audio/aiff

.aiff

audio/aiff

.anv

application/x-anv

.asa

text/asa

.asf

video/x-ms-asf

.asp

text/asp

.asx

video/x-ms-asf

.au

audio/basic

.avi

video/avi

.awf

application/vnd.adobe.workflow

.biz

text/xml

.bmp

application/x-bmp

.bot

application/x-bot

.c4t

application/x-c4t

.c90

application/x-c90

.cal

application/x-cals

.cat

application/vnd.ms-pki.seccat

.cdf

application/x-netcdf

.cdr

application/x-cdr

.cel

application/x-cel

.cer

application/x-x509-ca-cert

.cg4

application/x-g4

.cgm

application/x-cgm

.cit

application/x-cit

.class

java/*

.cml

text/xml

.cmp

application/x-cmp

.cmx

application/x-cmx

.cot

application/x-cot

.crl

application/pkix-crl

.crt

application/x-x509-ca-cert

.csi

application/x-csi

.css

text/css

.cut

application/x-cut

.dbf

application/x-dbf

.dbm

application/x-dbm

.dbx

application/x-dbx

.dcd

text/xml

.dcx

application/x-dcx

.der

application/x-x509-ca-cert

.dgn

application/x-dgn

.dib

application/x-dib

.dll

application/x-msdownload

.doc

application/msword

.dot

application/msword

.drw

application/x-drw

.dtd

text/xml

.dwf

Model/vnd.dwf

.dwf

application/x-dwf

.dwg

application/x-dwg

.dxb

application/x-dxb

.dxf

application/x-dxf

.edn

application/vnd.adobe.edn

.emf

application/x-emf

.eml

message/rfc822

.ent

text/xml

.epi

application/x-epi

.eps

application/x-ps

.eps

application/postscript

.etd

application/x-ebx

.exe

application/x-msdownload

.fax

image/fax

.fdf

application/vnd.fdf

.fif

application/fractals

.fo

text/xml

.frm

application/x-frm

.g4

application/x-g4

.gbr

application/x-gbr

.

application/x-

.gif

image/gif

.gl2

application/x-gl2

.gp4

application/x-gp4

.hgl

application/x-hgl

.hmr

application/x-hmr

.hpg

application/x-hpgl

.hpl

application/x-hpl

.hqx

application/mac-binhex40

.hrf

application/x-hrf

.hta

application/hta

.htc

text/x-component

.htm

text/html

.html

text/html

.htt

text/webviewhtml

.htx

text/html

.icb

application/x-icb

.ico

image/x-icon

.ico

application/x-ico

.iff

application/x-iff

.ig4

application/x-g4

.igs

application/x-igs

.iii

application/x-iphone

.img

application/x-img

.ins

application/x-internet-signup

.isp

application/x-internet-signup

.IVF

video/x-ivf

.java

java/*

.jfif

image/jpeg

.jpe

image/jpeg

.jpe

application/x-jpe

.jpeg

image/jpeg

.jpg

image/jpeg

.jpg

application/x-jpg

.js

application/x-javascript

.jsp

text/html

.la1

audio/x-liquid-file

.lar

application/x-laplayer-reg

.latex

application/x-latex

.lavs

audio/x-liquid-secure

.lbm

application/x-lbm

.lmsff

audio/x-la-lms

.ls

application/x-javascript

.ltr

application/x-ltr

.m1v

video/x-mpeg

.m2v

video/x-mpeg

.m3u

audio/mpegurl

.m4e

video/mpeg4

.mac

application/x-mac

.man

application/x-troff-man

.math

text/xml

.mdb

application/msaccess

.mdb

application/x-mdb

.mfp

application/x-shockwave-flash

.mht

message/rfc822

.mhtml

message/rfc822

.mi

application/x-mi

.mid

audio/mid

.midi

audio/mid

.mil

application/x-mil

.mml

text/xml

.mnd

audio/x-musicnet-download

.mns

audio/x-musicnet-stream

.mocha

application/x-javascript

.movie

video/x-sgi-movie

.mp1

audio/mp1

.mp2

audio/mp2

.mp2v

video/mpeg

.mp3

audio/mp3

.mp4

video/mpeg4

.mpa

video/x-mpg

.mpd

application/vnd.ms-project

.mpe

video/x-mpeg

.mpeg

video/mpg

.mpg

video/mpg

.mpga

audio/rn-mpeg

.mpp

application/vnd.ms-project

.mps

video/x-mpeg

.mpt

application/vnd.ms-project

.mpv

video/mpg

.mpv2

video/mpeg

.mpw

application/vnd.ms-project

.mpx

application/vnd.ms-project

.mtx

text/xml

.mxp

application/x-mmxp

.net

image/pnetvue

.nrf

application/x-nrf

.nws

message/rfc822

.odc

text/x-ms-odc

.out

application/x-out

.p10

application/pkcs10

.p12

application/x-pkcs12

.p7b

application/x-pkcs7-certificates

.p7c

application/pkcs7-mime

.p7m

application/pkcs7-mime

.p7r

application/x-pkcs7-certreqresp

.p7s

application/pkcs7-signature

.pc5

application/x-pc5

.pci

application/x-pci

.pcl

application/x-pcl

.pcx

application/x-pcx

.pdf

application/pdf

.pdf

application/pdf

.pdx

application/vnd.adobe.pdx

.pfx

application/x-pkcs12

.pgl

application/x-pgl

.pic

application/x-pic

.pko

application/vnd.ms-pki.pko

.pl

application/x-perl

.plg

text/html

.pls

audio/scpls

.plt

application/x-plt

.png

image/png

.png

application/x-png

.pot

application/vnd.ms-powerpoint

.ppa

application/vnd.ms-powerpoint

.ppm

application/x-ppm

.pps

application/vnd.ms-powerpoint

.ppt

application/vnd.ms-powerpoint

.ppt

application/x-ppt

.pr

application/x-pr

.prf

application/pics-rules

.prn

application/x-prn

.prt

application/x-prt

.ps

application/x-ps

.ps

application/postscript

.ptn

application/x-ptn

.pwz

application/vnd.ms-powerpoint

.r3t

text/vnd.rn-realtext3d

.ra

audio/vnd.rn-realaudio

.ram

audio/x-pn-realaudio

.ras

application/x-ras

.rat

application/rat-file

.rdf

text/xml

.rec

application/vnd.rn-recording

.red

application/x-red

.rgb

application/x-rgb

.rjs

application/vnd.rn-realsystem-rjs

.rjt

application/vnd.rn-realsystem-rjt

.rlc

application/x-rlc

.rle

application/x-rle

.rm

application/vnd.rn-realmedia

.rmf

application/vnd.adobe.rmf

.rmi

audio/mid

.rmj

application/vnd.rn-realsystem-rmj

.rmm

audio/x-pn-realaudio

.rmp

application/vnd.rn-rn_music_package

.rms

application/vnd.rn-realmedia-secure

.rmvb

application/vnd.rn-realmedia-vbr

.rmx

application/vnd.rn-realsystem-rmx

.rnx

application/vnd.rn-realplayer

.rp

image/vnd.rn-realpix

.rpm

audio/x-pn-realaudio-plugin

.rsml

application/vnd.rn-rsml

.rt

text/vnd.rn-realtext

.rtf

application/msword

.rtf

application/x-rtf

.rv

video/vnd.rn-realvideo

.sam

application/x-sam

.sat

application/x-sat

.sdp

application/sdp

.sdw

application/x-sdw

.sit

application/x-stuffit

.slb

application/x-slb

.sld

application/x-sld

.slk

drawing/x-slk

.smi

application/smil

.smil

application/smil

.smk

application/x-smk

.snd

audio/basic

.sol

text/plain

.sor

text/plain

.spc

application/x-pkcs7-certificates

.spl

application/futuresplash

.spp

text/xml

.ssm

application/streamingmedia

.sst

application/vnd.ms-pki.certstore

.stl

application/vnd.ms-pki.stl

.stm

text/html

.sty

application/x-sty

.svg

text/xml

.swf

application/x-shockwave-flash

.tdf

application/x-tdf

.tg4

application/x-tg4

.tga

application/x-tga

.tif

image/tiff

.tif

application/x-tif

.tiff

image/tiff

.tld

text/xml

.top

drawing/x-top

.torrent

application/x-bittorrent

.tsd

text/xml

.txt

text/plain

.uin

application/x-icq

.uls

text/iuls

.vcf

text/x-vcard

.vda

application/x-vda

.vdx

application/vnd.visio

.vml

text/xml

.vpg

application/x-vpeg005

.vsd

application/vnd.visio

.vsd

application/x-vsd

.vss

application/vnd.visio

.vst

application/vnd.visio

.vst

application/x-vst

.vsw

application/vnd.visio

.vsx

application/vnd.visio

.vtx

application/vnd.visio

.vxml

text/xml

.wav

audio/wav

.wax

audio/x-ms-wax

.wb1

application/x-wb1

.wb2

application/x-wb2

.wb3

application/x-wb3

.wbmp

image/vnd.wap.wbmp

.wiz

application/msword

.wk3

application/x-wk3

.wk4

application/x-wk4

.wkq

application/x-wkq

.wks

application/x-wks

.wm

video/x-ms-wm

.wma

audio/x-ms-wma

.wmd

application/x-ms-wmd

.wmf

application/x-wmf

.wml

text/vnd.wap.wml

.wmv

video/x-ms-wmv

.wmx

video/x-ms-wmx

.wmz

application/x-ms-wmz

.wp6

application/x-wp6

.wpd

application/x-wpd

.wpg

application/x-wpg

.wpl

application/vnd.ms-wpl

.wq1

application/x-wq1

.wr1

application/x-wr1

.wri

application/x-wri

.wrk

application/x-wrk

.ws

application/x-ws

.ws2

application/x-ws

.wsc

text/scriptlet

.wsdl

text/xml

.wvx

video/x-ms-wvx

.xdp

application/vnd.adobe.xdp

.xdr

text/xml

.xfd

application/vnd.adobe.xfd

.xfdf

application/vnd.adobe.xfdf

.xhtml

text/html

.xls

application/vnd.ms-excel

.xls

application/x-xls

.xlw

application/x-xlw

.xml

text/xml

.xpl

audio/scpls

.xq

text/xml

.xql

text/xml

.xquery

text/xml

.xsd

text/xml

.xsl

text/xml

.xslt

text/xml

.xwd

application/x-xwd

.x_b

application/x-x_b

.sis

application/vnd.symbian.install

.sisx

application/vnd.symbian.install

.x_t

application/x-x_t

.ipa

application/vnd.iphone

.apk

application/vnd.android.package-archive

.xap

application/x-silverlight-app

2.3 第三方模块

art-template

vue

必须通过npm 安装

2.4 模块化概念

  • 文件作用域
  • 通信规则
  • 加载 require
  • 导出

2.5 CommonJs模块规范

  • 模块作用域
  • 使用require来加载模块 语法:var|let 变量名=require(‘模块’) 作用:执行被加载模块中的代码;得到被加载模块中的exports导出接口对象
  • 使用exports接口对象来导出模块中的成员 node是模块作用域,所有成员再当前模块有效; module.exports=‘字符串’ module.exports=function(){} 后面会覆盖前面的值; 注意:exports是module.exports的一个引用,不能直接赋值。

2.6 require 加载规则

  • 优先从缓存加载
  • 判断模块标识
  • 核心模块
  • 第三方模块
  • 自定义模块
代码语言:javascript
代码运行次数:0
运行
复制
//路径形式的模块
// ./
// ../
//    /xxx   一般不用
//   /   标识当前模块系统所属的磁盘根路径

//  .js  后缀名可以省略
//  require(./foo.js)

//核心模块实际上也是文件,核心模块文件已经编译到node.exe了
//github.com-->node查看源码可以看到fs.js  os.js
//https://github.com/nodejs/node
//https://github.com/nodejs/node/tree/master/lib

//第三方模块:本质上也是文件,需要通过npm下载,使用的时候仍然通过require('包名')来加载使用
//不可能由任何一个第三方模块和核心模块文件名一致
//既不是核心模块,也不是核心路径的模块,先找到node-modules目录,其次找其中的art-template
//  node_modules/art-template
//  node_modules/art-template/package.json文件
//  node_modules/art-template/package.json中的main属性
//  main属性中记录了art-template的入口模块,加载第三方包(包名),实际最终加载的还是文件
//  模拟实现
// let template=require('art-template')
// 模拟一下


require('a')

测试第三方模块,在node_modules下新建一个a目录,创建package.json的文件

代码语言:javascript
代码运行次数:0
运行
复制
{
  "main":"foo.js"
}

foo.js

代码语言:javascript
代码运行次数:0
运行
复制
console.log('a中的foo.js被加载了...')

module.exports=()=>{
    console.log('fooooooo....')
}
代码语言:javascript
代码运行次数:0
运行
复制
//如果package.json不存在或者main指定的入口模块也没有,则node会自动查找该目录下的index.js
//即index.js会作为一个默认备选项。如果上述条件不成立,则去上级目录去寻找node_modules的目录,没有继续往
//上级寻找,在a目录下创建index.js
console.log('a--->index')

如果继续往上一级查找node_modules,还没有找到,则显示:

Error: Cannot find module ‘vue’

注意:我们的一个项目有且只有一个node_modules,这样项目都可以加载到第三方模块包,不会出现多个。

三.模板引擎

3.1 Apache功能

apache软件默认有一个www目录,此目录下的html文件都可以通过node。案例模拟实现apache项目在浏览器的效果。

读取node下的www目录文件的代码

代码语言:javascript
代码运行次数:0
运行
复制
let http=require('http')
let fs=require('fs')

//2.开始设置服务;
let server=http.createServer()
server.on('request',(req,resp)=>{
    let url=req.url
    //如果是这个方式的话,去某个地方
    /*
    *   /   index.html
    *   /a.txt +/a.txt
    *  /mi/login.html
    *  /img/bg.jpg   wwwdir+/img/bg.jpg
    * */
    let wwwDir='D:/aaa/node/www'
    let filePath='/index.html'
    if(url!=='/'){
        filePath=url
    }
    console.log(wwwDir+filePath)
    fs.readFile(wwwDir+filePath,(err,data)=>{
        if(err){
            console.log('404 Not Found!')
        }
        resp.end(data)
    })

})
//3.绑定机制;
server.listen(3000,()=>{
    console.log('启动了...')
})

3.2 art-template

模板引擎不关心内容,只关心自己能认识的模板标记语法。Mustache是一个logic-less(轻逻辑)模板解析引擎,

它是为了使用户界面与业务数据(内容)分离而产生的,

它可以生成特定格式的文档,通常是标准的HTML文档。

比如小程序的wxml中的代码

代码语言:javascript
代码运行次数:0
运行
复制
{{userInfo.nickName}},这里的{{ }}就是Mustache的语法。

1 介绍:

art-template 是一个简约、超快的模板引擎。 它采用作用域预声明的技术来优化模板渲染速度,从而获得接近 JavaScript 极限的运行性能,并且同时支持 NodeJS 和浏览器。

1.1 模板语法:

art-template 同时支持两种模板语法。标准语法可以让模板更容易读写;原始语法具有强大的逻辑处理能力。

代码语言:javascript
代码运行次数:0
运行
复制
{{if user}}
<h2>{{user.name}}</h2>
{{/if}}
代码语言:javascript
代码运行次数:0
运行
复制
<% if (user) { %>
<h2><%= user.name %></h2>
<% } %>

使用步骤:

1.安装

npm install art-template

2.在需要使用的文件中加载art-template

let temp=require(‘art-template’)

3.查文档,使用art-template的API

在node-modules下的模板文件

代码语言:javascript
代码运行次数:0
运行
复制
<!DOCTYPE html>
<html style="height: 100%">
<head>
 <meta charset="utf-8">
 <!--<title>{{ title }}</title>-->
 <title><%=title%></title>
</head>
<body>
   <script src="../node_modules/art-template/lib/template-web.js"></script>
   <script type="text/template" id="tp1">
      hello{{name}}
     年龄:{{age}}
    地址:{{address}}
    爱好:{{each hobbies}}{{$value}}{{/each}}
   </script>

<!--测试-->
 <script>
    var ret=template('tp1',{name:'jack ma',
     age:22,
     address:'河南省郑州市',
     hobbies:['吃好饭','唱好歌','开好车']
    })
   console.log(ret)
 </script>
</body>
</html>

node.js使用art-template

代码语言:javascript
代码运行次数:0
运行
复制
let template=require('art-template')



//template('script标签id',{对象})
let result=template.render('Hello:{{name}}',{name:'张晨光'})

console.log(result)

结合模板来使用

代码语言:javascript
代码运行次数:0
运行
复制
let template=require('art-template')

let tempstr=`<!DOCTYPE html>
<html style="height: 100%">
<head>
 <meta charset="utf-8">
 <title><%=title%></title>
</head>
<body>
     hello{{name}}
     年龄:{{age}}
    地址:{{address}}
    爱好:{{each hobbies}}{{$value}}{{/each}}
</body>
</html>`

//template('script标签id',{对象})
let result=template.render(tempstr,{name:'jack ma',
    age:22,
    address:'河南省郑州市',
    hobbies:['吃好饭','唱好歌','开好车']
})

console.log(result)

不能使用这种方式,需要使用文件来读写

模板页面:

代码语言:javascript
代码运行次数:0
运行
复制
<!DOCTYPE html>
<html style="height: 100%">
<head>
 <meta charset="utf-8">
 <title><%=title%></title>
</head>
<body>   
    hello{{name}}
    年龄:{{age}}
    地址:{{address}}
    爱好:{{each hobbies}}{{$value}}{{/each}}   
</body>
</html>
<!--测试-->
 <script>
    var ret=template('tp1',{name:'jack ma',
     age:22,
     address:'河南省郑州市',
     hobbies:['吃好饭','唱好歌','开好车']
    })
   console.log(ret)
 </script>

node.js代码;

代码语言:javascript
代码运行次数:0
运行
复制
let template=require('art-template')

let fs=require('fs')
fs.readFile('./template.html',(err,data)=>{
    if(err){
       return console.log('读取文件有误...')
    }
    //没有问题,则这样;
    //template('script标签id',{对象})
    let result=template.render(data.toString(),{name:'jack ma',
        age:22,
        address:'河南省郑州市',
        hobbies:['吃好饭','唱好歌','开好车']
    })

    console.log(result)

})
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2022-02-24,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • Node.js
  • 一.Node基础
    • 1.1 what is node ?
    • 1.2作用
    • 1.3为什么学习?
    • 1.4 常见问题
  • 1.4 案例:操作步骤
  • 1.5 http服务
  • 二.模块
  • 2.1 内置模块
    • 2.1.1.文件夹的操作
    • 2.1.2 文件的操作
    • 2.1.3 判断是文件还是目录
  • 2.2 自定义模块
    • 2.3 操作系统
    • 2.4 http+箭头函数
    • 2.5 发送文件内容
  • 2.3 第三方模块
  • 2.4 模块化概念
  • 2.5 CommonJs模块规范
  • 2.6 require 加载规则
  • 三.模板引擎
  • 3.1 Apache功能
  • 3.2 art-template
  • 1 介绍:
    • 1.1 模板语法:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档