gulp配置browserSync，搭建開發環境，代理ajax請求

之前學webpack，看到webpack-dev-server能夠起http服務，又能自動刷新，感覺這種開發會很愉快。

最近在用gulp，網上找了下教程，以及自己摸索+搜索，搭配了個簡單的例子。

項目目錄

app

--dist

--node_modules

--src

----index.htm

----index.css

----index.png

----index.js

--gulpfile

--package.json

gulpfile文件內容

const gulp = require(gulp)const browserSync = require(browser-sync)const reload = browserSync.reload// 以下兩行為代理ajax請求const proxyMiddleware = require(http-proxy-middleware)const proxy = proxyMiddleware(/services, {target: http://localhost:8080, changeOrigin: true});gulp.task(server, function () { //配置browserSync browserSync.init({ server: { baseDir: ./, // http服務的目錄，這是根目錄 middleware: [proxy] // 使用中間件配置代理 }, port: 3005 // 本地服務埠 }) gulp.watch(src/**/*).on(change, reload) // 監聽src目錄下的文件改變，然後重載})

推薦閱讀：