用Node.js创建静态服务器、模块的上传和使用(前端模块化)

Node.js服务器

Node.js服务器有两种

  1. web服务器( 静态服务器 )
  2. api服务器( 动态服务器 ) 数据接口

用Node.js创建一个静态服务器,然后将文件部署在这个服务器中

源代码:

var http = require( 'http' );

var port = 8080 ;
var hostname = '127.0.0.1'
var path = require( 'path' )  // 磁盘路径处理的模块
var fs = require( 'fs' ) // 操作文件、目录的模块
var url = require( 'url' ) // 处理url

var server = http.createServer( function ( request, response ) {
  var staticPath = path.join( __dirname,'static'  )
  var urlObj = url.parse( request.url )
/*   Url {
    protocol: null,
    slashes: null,
    auth: null,
    host: null,
    port: null,
    hostname: null,
    hash: null,
    search: null,
    query: null,
    pathname: '/static/css/index.css',
    path: '/static/css/index.css',
    href: '/static/css/index.css' }
*/

if( urlObj.pathname === '/'){
  urlObj.pathname += 'index.html'
}

console.log( urlObj.pathname )
  
  // fs.readFile(路径,字符编码,错误优先的回调函数)

  var filePath = path.join( staticPath, urlObj.pathname )

  fs.readFile( filePath,'binary',function( error,filecontent ) {
    if ( error ){
      throw error 
    }else {
      response.end()
    }
  })

})

server.listen( port , hostname , function () {
  console.log( `The server is runing: http://${ hostname }:${ port }` )
})

模块/包 与Common.js

Node.js使用了Common.js规范

Node.js中Common.js规范有三种使用类型:

  1. 内置模块 path url fs process

  2. 第三方模块:插件
    前端的第三方模块基本都存放在 http://npmjs.com
    npmjs.com中第三方包的 文档 就在这里
    文档阅读能力是我们需要练成的

    以一个 request 的一个模块来进行研究
    需要一个package.json的文件来记录我们安装过的模块
    package.json 文件的创建
    npm init 一步一步进行
    快速创建 npm init -y / cnpm init -y / yarn init -y

    命令安装的环境区分
    cnpm i request --save 生产环境安装
    简写: cnpm i request -S

    生产环境安装在package.json中记录在 dependencies 中
    cnpm i request --save-dev 开发环境安装
    简写: cnpm i request -D

    开发环境安装在 package.json中记录在 depenDencies 中
    后端 不存在跨域问题, 后端是不依靠浏览器的

    第三方的包使用步骤:

    1. 引用 ( 第三方包如果使用了模块化安装, require( 模块名称 ) )
    2. 使用:
      举例: request是用来数据请求的 : 接下来我们去请求一下豆瓣的数据
      */
var request = require( 'request' )
var http = require ( 'http' )

http.createServer( function ( req,res ) {
  // request ( url, function ( error, response, body ) {})
  request ( 'https://m.lagou.com/listmore.json', function ( error, response, body ) {
    if( error ) throw error 
    // console.log( response )  //请求的接口的信息
    // console.log( body ) // 请求回来的数据
    res.write( body )
    res.end( )
  })
  
}).listen( 8001 )
  1. 自定义模块 :

    -1. 先定义一个 变量, 变量值可以随意

    -2. 导出模块

     module.exports = 变量名
    
     module.exports = {
       变量名
     }
    
    1. 导入
      如果是第一种方式导出 , var 变量名 = require( 相对路径 )

      如果是第二种方式导出, var { 变量名 } = require ( 相对路径 )

前端模块化

  1. AMD ( require.js )
  2. CMD ( sea.js )
  3. Common.js ( module.export require )
  4. es6 模块化 ( export import )

自定义模块上传 npmjs.com 过程

  1. 创建package.json

  2. http://npmjs.com 上注册账号

  3. 激活账号( npmjs.com会发送一个邮件给你的注册邮箱 )

  4. 使用命令登录npmjs.com ( 登录前将你的源从淘宝源 切到 npmjs)

    • 问题 : 如何切换源呢?
    • 解决: 使用 nrm 切换
    • nrm 安装 $ npm i nrm -g
      $ npm adduser
  5. 如果登录成功, 提示为: Logged in as yanyabing on https://registry.npmjs.org/.

  6. 发布包到npmjs
    $ npm publish

  7. 在npmjs官网查看包有没有发送上去

  8. 下载包来使用一下
    $ npm i 包名称 -S / -D

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值