Zum deaktivieren der cross-device-Aktion spiegelung Funktionalität von BrowserSync? (GhostMode)
Unserem team das gulp-angular-generator mit yeoman zu Gerüst in unsere web-app. Es nutzt browsersync zu behandeln live lädt, was wir wollen. Wir sind jedoch nur bereitgestellt, um unseren Entwicklungs-server, und jetzt, wenn zwei Entwickler gulp dienen Befehl an der gleichen Zeit, haben Sie beide gezeigt, sind die gleichen Fenster (also ein Entwickler-Typen an einem Fenster, es zeigt sich in den anderen developer ' s Fenster). Ich glaube, dies ist aufgrund BrowserSync cross-device testing Fähigkeiten, aber ich bin an einem Verlust für, wie man diese Funktion deaktivieren. Wenn jemand weiß, wie dies zu tun (möglichst ohne deaktivieren von unseren live-reload-Funktionalität) lassen Sie es mich bitte wissen!
Unten ist der code für meine server.js Datei in die gulp-Ordner, die die gleiche wie die eine, die kommt mit dem gulp-Winkel-generator, so hoffentlich wird dies helfen, einige Leute.
'use strict';
var path = require('path');
var gulp = require('gulp');
var conf = require('./conf');
var browserSync = require('browser-sync');
var browserSyncSpa = require('browser-sync-spa');
var util = require('util');
var proxyMiddleware = require('http-proxy-middleware');
function browserSyncInit(baseDir, browser) {
browser = browser === undefined ? 'default' : browser;
var routes = null;
if(baseDir === conf.paths.src || (util.isArray(baseDir) && baseDir.indexOf(conf.paths.src) !== -1)) {
routes = {
'/bower_components': 'bower_components'
};
}
var server = {
baseDir: baseDir,
routes: routes
};
/*
* You can add a proxy to your backend by uncommenting the line bellow.
* You just have to configure a context which will we redirected and the target url.
* Example: $http.get('/users') requests will be automatically proxified.
*
* For more details and option, https://github.com/chimurai/http-proxy-middleware/blob/v0.0.5/README.md
*/
//server.middleware = proxyMiddleware('/users', {target: 'http://jsonplaceholder.typicode.com', proxyHost: 'jsonplaceholder.typicode.com'});
browserSync.instance = browserSync.init({
startPath: '/',
server: server,
browser: browser
});
}
browserSync.use(browserSyncSpa({
selector: '[ng-app]'//Only needed for angular apps
}));
gulp.task('serve', ['watch'], function () {
browserSyncInit([path.join(conf.paths.tmp, '/serve'), conf.paths.src]);
});
gulp.task('serve:dist', ['build'], function () {
browserSyncInit(conf.paths.dist);
});
gulp.task('serve:e2e', ['inject'], function () {
browserSyncInit([conf.paths.tmp + '/serve', conf.paths.src], []);
});
gulp.task('serve:e2e-dist', ['build'], function () {
browserSyncInit(conf.paths.dist, []);
});
Du musst angemeldet sein, um einen Kommentar abzugeben.
Konfrontiert, die dasselbe problem haben, können Sie einfach die ghost-Modus auf false " in der init-Optionen.
nicht ändern müssen default.config.js 🙂
Sorry die Beantwortung meiner eigenen Frage, aber ich fand die Antwort ein paar Tage später und da hat niemand beantwortet dies noch dachte ich, ich poste meine Lösung.
Das problem, das wir zu kämpfen hatten, scheint verursacht zu sein durch eine Funktion in BrowserSync als "GhostMode" die Spiegel-Klick und scroll-Aktionen, sowie mehrere form actions, auf allen Geräten. Durch deaktivieren dieser ist sehr einfach: Suchen Sie für Ihr BrowserSync config-Datei (bei mir war es am root/node_modules/browser-sync/lib/default.config.js) und öffnen Sie diese. Suchen Sie in dieser Datei etwas ähnliches wie das folgende:
und ändern Sie ihn so, dass er sagt
ghostMode: false,
Diesem fest unser Problem und das wird hoffentlich anderen helfen, wenn Sie stoßen auf das gleiche problem.
Im Falle der Verwendung der QuickStart Samen zu initialisieren, Ihr Projekt, die Einstellungen von BrowserSync kann konfiguriert werden, mit bs-config.json Datei auf Projekt-root-Ordner.
Meine Datei enthält die folgenden: