我正在开发一个快速应用程序。我只使用browserSync来观看静态文件,但现在,我想用快速应用程序做同样的事情。
我看到很多使用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",
},
答案 0 :(得分:12)
感谢@ lim-h的帮助,确实可以将参数--proxy
( - P)添加到browser-sync start
browsersync.io/docs/command-line
您可以在此处下载演示https://github.com/damienromito/express-sync
启动快速服务器后,将--proxy
选项添加到browser-sync start
示例
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文件
答案 1 :(得分:0)
@Damien Romito
您可以使用此插件: - https://www.npmjs.com/package/connect-browser-sync