建立本地服務，及服務代理(解決跨域)，支持熱更新，針對老項目設計

建立本地服務，及服務代理，支持熱更新

Create http proxy support 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/', }
        /* '/apiFlag': {
            target: 'http://doman.com/',
            pathRewrite: {
                // ^/old-path' : '/new-path
                // 下面配置是將，/apiFlag 開頭的請求，重寫爲 /newFlag，也可爲 '' (空)
                '^/apiFlag': '/newFlag',
            }
        } */
    },
    notify: true,
    // ignores: ['js'],
    callback: function () {
        console.log('Server run success ...')
    },
}

server(options)

options 參數說明：

參數	說明	類型	默認	是否必選	可選項
watch	是否開啓熱更新	Boolean	false	是	-
watchStatic	熱更新目錄	String		是	-
serverStatic	靜態服務目錄	String		是	-
proxyTable	要代理的 doman	Object		是	-
port	端口	Number	8008	否	-
notify	是否在瀏覽器端顯示通知	Boolean	false	否	-
ignores	忽略 watch 文件格式	Array	-	否	[css, html, js]
callback	服務啓動成功回調	Function	-	否	-

啓動服務

node server.js
# 或
# 本身配置 npm scripts 運行

# 更改 server.js 文件後要重啓服務，更改才生效

瀏覽器運行

localhost: <port>/

注：

proxyTable 是個對象，

鍵 爲: 請求 URL 的統一標識字段，如請求接口：http://doman/api/back/login，那麼 api 就是它的標識字段

值 爲: {
    target: 要代理的（域名或IP） doman, # (必填)
    pathRewrite: { '^/oldFlag': '/newFlag', } # (非必填)
}

pathRewrite 字段做用是防止後端接口比較混亂，沒有統一的標識符，
這時前端在本地開發時，能夠本身添加一個統一標識符，並使用 pathRewrite 的功能，再讓這個字段設置爲空字符，這樣就能夠請求到服務端原本的 URL

若是好用還望給個 Star， 您的 Star 是我最大的動力，謝謝！

GitHub 地址

歡迎訪問個人我的博客 乾貨傳送門

若是好用還望給個 Star， 您的 Star 是我最大的動力，謝謝！ GitHub 地址

未經做者容許，禁止轉載，謝謝！
歡迎留言、評論！