If Browsersync is launched over the command line, it'll provide two different addresses:

1. Select the address for the **UI** / Admin Controls

   [![Browsersync CLI][1]][1]


2. From there you can setup configuration settings with the UI and disable cross device mirroring



  [![Browsersync  UI][2]][2]


  [1]: https://i.stack.imgur.com/ASCqV.png
  [2]: https://i.stack.imgur.com/3CxKW.png

Our team used the gulp-angular generator with yeoman to scaffold out our web app. It uses browsersync to handle live reloads, which we want. However, we just deployed to our development server, and now when two developers are using the gulp serve command at the same time, they both are shown the same window (i.e. one developer types on one window, it shows up in the other developer's window as well). I believe this is due to BrowserSync's cross-device testing capabilities, however I am at a loss for how to disable this feature. If anyone knows how to do this (preferably without disabling our live-reload functionality) please let me know!

Below is the code for my server.js file in the gulp folder, which is the same as the one that comes with the gulp-angular generator, so hopefully this will help some people.

    '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, []);
    });



How to disable cross-device action mirroring functionality of BrowserSync? (GhostMode)

You can use [**js-yaml**][1], which seems to be the most widely used / adopted, and also is officially recommended by [**yaml.org**][2]


```bash
npm i js-yaml
```

Then you can read in the json file, parse with `safeLoad`, and then serialize with `safeDump` like this:

```
const { promises: fs } = require("fs")
const yaml = require('js-yaml');

(async function main() {

    try {

        let configJson = await fs.readFile("./config.json", "utf-8")
        let doc = yaml.safeLoad(configJson)
        let configYaml = yaml.safeDump(doc)
        await fs.writeFile("./config.yaml", configYaml, "utf-8")


    } catch (error) {
        console.log(error)
    }

})()
```

### Further Reading

* [JavaScript YAML Parser][5]
* [How to convert JSON to YAML in javascript][3]
* [Convert yaml to json using javascript][4]




### NPM Libraries

* [nodeca/**js-yaml**][6] ([npm][7] - 5,700 ⭐s
* [jeremyfa/**yaml.js**][8] ([npm][9]) - 796 ⭐s
* [eemeli/**yaml**][10] ([npm][11]) - 298 ⭐s
* [coolaj86/**json2yaml**][12] ([npm][13]) - 69 ⭐s



[1]: https://www.npmjs.com/package/js-yaml
[2]: https://yaml.org/
[3]: https://stackoverflow.com/q/38781929/1366033
[4]: https://stackoverflow.com/q/36973736/1366033
[5]: https://stackoverflow.com/q/4335804/1366033
[6]: https://github.com/nodeca/js-yaml
[7]: https://www.npmjs.com/package/js-yaml
[8]: https://github.com/jeremyfa/yaml.js
[9]: https://www.npmjs.com/package/yamljs
[10]: https://github.com/eemeli/yaml
[11]: https://www.npmjs.com/package/yaml
[12]: https://github.com/coolaj86/json2yaml
[13]: https://www.npmjs.com/package/json2yaml

Using gulp/node, how can I convert this JSON file into a YML file?

Starting file: **`config.json`**

```json
{
  ":hello_world": "Test",
  ":foo_bar": [
    "One.js",
    "Two.txt",
  ]
}
```

Desired output: **`config.yml`**

```yaml
:hello_world: Test 
:foo_bar:
- One.js
- Two.txt
```


Convert json to yml with Gulp/Node

### [Configuring a publishing source for GitHub Pages][1] (very limited)

While you *can* select a folder as the source for gh-pages, you can *only* do so for the `/docs` directory at the parent level, and you *still* have to actually commit the built files in order to do so, which means you'll have to override the `.gitignore` and commit them twice

<img src="https://i.stack.imgur.com/ggDJH.png" width="313"/>

### Automated Deploy Scripts

If you're using npm, there are a couple packages that handle publishing sub-directories to gh-pages.  Install with option `--save-dev` to add it to your `devDependencies`:

* [**push-dir**][2]

    
    
        # install
        $ npm install push-dir --save-dev
        
        # usage
        $ push-dir --dir=dist --branch=gh-pages

* [**gh-pages**][3]

    
    
        # install
        $ npm install gh-pages --save-dev
        
        # usage
        $ gh-pages -d dist

In either case, if get a command line tool working for you and get it configured with the right options, you can alias it in your `package.json` like this:



    "scripts": {
      "deploy": "npm run build && gh-pages -d dist"
    }

**Further Reading**: 

* [Deploying a subfolder to GitHub Pages][4]
* [Deploy Vue to GitHub pages-the easy way!][5]

[1]: https://help.github.com/articles/configuring-a-publishing-source-for-github-pages/
[2]: https://www.npmjs.com/package/push-dir
[3]: https://www.npmjs.com/package/gh-pages
[4]: https://gist.github.com/cobyism/4730490
[5]: https://medium.com/@codetheorist/vue-up-your-github-pages-the-right-way-955486220418

I was trying to publish my -username-.github.io repository to github pages but my `index.html` is inside `dist` folder.

I cannot use `git subtree push --prefix dist origin gh-pages` because this is meant for project pages, not user/org pages.

All I want is, github to treat dist as root directory for hosting user/org page.  Please help.Thanks

PS: I don't want to do redirection hack.
