node.js - 没有 gulp 的 Express 和 BrowserSync?

标签 node.js express gulp browser-sync nodemon

我正在开发一个 Express 应用程序。我只使用 browserSync 来观看静态文件,但现在,我想用 express 应用程序做同样的事情。

我看到了很多使用 Gulp 的例子。但我想知道是否有任何解决方案可以仅使用 npm 脚本进行管理? (还有 nodemon?)

我当前的脚本:

"scripts": {
    "start": "npm run start-server & npm run watch-js",
    "build-js": "browserify -t babelify -t aliasify -t partialify src/ | uglifyjs > public/app.js",
    "start-server": "browser-sync start --server 'public/' --files 'public/' --port 9000 --no-ui",
    "watch-js": "watchify -vd -t babelify -t aliasify -t partialify src/ -o public/app.js",
  },

最佳答案

感谢@lim-h 的帮助,确实可以将参数 --proxy (-P) 添加到 browser-sync start browsersync.io/docs/command-line

您可以在这里下载演示 https://github.com/damienromito/express-sync

启动express服务器后,在browser-sync start中添加--proxy选项


示例

node app & browser-sync start --proxy 'localhost:9000' --files 'public'"

对应的app.js:

var express = require('express'), 
    app = express(),
    router = express.Router()

app.use(router)
app.use('/public', express.static('public'));

router.all('/', function (req, res, next) {  

  res.send('<!DOCTYPE html>' +
            '<html>' +
            '<head>' +
                '<title>Whyd Store</title>' +
                '<link rel="stylesheet" type="text/css" href="public/style.css">' +
            '</head>' +
            '<body>' +
            '<p>Hello World</p>' +
            '</body>' +
            '</html>')
});

app.listen(9000);  
module.exports = app; 

注意:为了测试浏览器与这个示例项目的同步,我更新了 /public 文件夹中的 style.css 文件

关于node.js - 没有 gulp 的 Express 和 BrowserSync?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37548537/

相关文章:

javascript - 遍历嵌套在 JSON 中的结果数组

javascript - gulp-sass @import CSS 文件

node.js - socket.volatile.emit 来自客户端

javascript - 代理未检测到嵌套数组的更改

express - 如何使用express和react路由器发送GET/POST请求?

mongodb - 无法获取/express.js 路由

javascript - 在异步函数内映射数组会导致错误

javascript - 在 Jade 中有条件地为 body 分配一个类

javascript - 不确定 BrowserSync 主页上给出的示例

node.js - 将 webhint 与 angular7 一起使用