创建本地服务,及服务代理(解决跨域),支持热更新,针对老项目设计

2018-04-22 admin

本地开发,创建本地服务,及代理,支持热更新

Create http proxy and Hot update

TODO

特别针对老型项目设计,没有使用构建工具( webpack、gulp、grunt etc.)

确保你的 nodejs 版本 >= 8.0.0, 解决跨域问题,支持本地开发热更新


欢迎访问我的个人博客 干货传送门

安装(install)

yarn add @gauseen/web-proxy -D

# or

npm i @gauseen/web-proxy -D

使用(usage)

// 首先,在项目根目录创建 server.js 文件
// 例子:
// server.js

const path = require('path')
const server = require('@gauseen/web-proxy')

const options = {
    watch: false,
    watchStatic: path.join(__dirname, './demo/'),
    serverStatic: path.join(__dirname, './'),
    port: 8008,
    proxyTable: {
        '/api': { target: 'http://doman.com/', }
    },

}

server(options)

options 参数说明:

参数 说明 类型 默认 是否必选
watch 是否开启热更新 Boolean false
watchStatic 热更新目录 String
serverStatic 静态服务目录 String
proxyTable 要代理的 doman Object
port 端口 Number 8008

启动服务

node server.js
# 或
# 自己配置 npm scripts 运行

打开浏览器,访问页面即可

localhost:8008/

注:

proxyTable 是个对象, 键 为: 请求 URL 的统一标识字段, 值 为: { target: 要代理的(域名或IP) doman }

如果好用还望给个 Star, 您的 Star 是我最大的动力,谢谢!

GitHub 地址

未经作者允许,禁止转载,谢谢! 欢迎留言、评论!

原文链接:https://segmentfault.com/a/1190000014527196

本站文章除注明转载外,均为本站原创或编译。欢迎任何形式的转载,但请务必注明出处。

转载请注明:文章转载自 JavaScript中文网 [https://www.javascriptcn.com]

本文地址:https://www.javascriptcn.com/read-30107.html

文章标题:创建本地服务,及服务代理(解决跨域),支持热更新,针对老项目设计

相关文章
JS中Select下拉列表类(支持输入模糊查询)功能
下面给大家分享一段代码关于select下拉列表类支持输入模糊查询功能的实现代码,具体代码如下所示: <span style="font-size:14px;"> <HTML> &lt...
2017-03-06
响应式Web设计的9项基本原则
响应式web设计对于解决多类型屏幕问题来说是个不错方案,但从印刷的角度来看,其却存在着很多的困难。没有固定的页面尺寸、没有毫米或英寸,没有任何物理限制,让人感到无从下手。随着建立网站可用的各种小工具越来越多,像素设计局限于桌面和移动端也已经...
2015-11-12
4种方法帮你的网站创建更丰富的Web体验
现在的网站已经从一个简单的文本页面开始进化了很多,我们可以制作出丰富的视觉效果来增加用户在桌面浏览器和移动浏览器的体验。 今天这篇文字就给大家分享4个实用的方法,来帮助你创建更好的Web体验。 对于那些还在用IE6的朋友,我只想说一句:go...
2016-01-13
JS常见创建类的方法小结【工厂方式,构造器方式,原型方式,联合方式等】
本文实例讲述了JS常见创建类的方法。分享给大家供大家参考,具体如下: Javascript是一种基于对象的语言,你遇到的所有东西几乎都是对象。但是,它又不是一种真正的面向对象编程(OOP)语言,因为它的语法中没有Class。(不过,ES6引...
2017-04-05
JavaScript判断是否为数组的3种方法及效率比较
今天针对不同的数组判定方式在chrome上做了一个效率的对比,结果如下: 其代码如下: var ret; var o = [1,2,3]; var toStr = {}.toString; var array = {}; arra...
2017-03-22
12个Web设计师必备的Bootstrap工具
作为一位设计师,会经常追寻新鲜有趣的设计工具,这些工具会提高工作的效率,使得工作更有效, 最重要的是使工作变得更方便。非常肯定的说,随着日益增长的工具和应用的数量,设计和开发变得越来越简单了。其中最普遍使用的最终框架 之一是 Bootstr...
2015-12-24
IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题
本文主要通过代码示例给大家介绍IE7浏览器窗口大小改变事件执行多次bug及IE6/IE7/IE8下resize问题;分步介绍,先给大家介绍IE7浏览器窗口大小改变事件执行多次bug,具体问题分析及解决方案请看下文。 var resizeTi...
2017-03-29
angular+ionic 的app上拉加载更新数据实现方法
第一步,首先需要在<ion-content>标签里面加入标签<ion-infinite-scroll ng-if="hasmore" on-infinite="loadMore()"...
2017-03-07
JS实现的验证身份证及获取地区功能示例
本文实例讲述了JS实现的验证身份证及获取地区功能。分享给大家供大家参考,具体如下: 这里的代码可以用来验证身份证号,并且根据身份证号来判断是哪个省份及性别 代码示例: <head > <title><&#x...
2017-03-08
nodejs搭建本地服务器并访问文件的方法
安装node:https://nodejs.org/en/download/ 在本地建立目录:f:/nodetest,在该目录下新建index.html作为我们将要访问的内容。新建server.js作为node开启的入口: $ cd f:&...
2017-03-13
回到顶部