React-starter-kit: How to turn off browser-sync in --release?

Created on 10 Jul 2017  Â·  7Comments  Â·  Source: kriasoft/react-starter-kit

I would like to add a flag or modify yarn start -- --release to start RSK without browser-sync. It is a big dependency and I would like to turn it off in production.

Can anyone point me in the right direction?

I believe the only place that Browser-Sync is referenced directly is in ./tools/start.js

  // Launch the development server with Browsersync and HMR
  await new Promise((resolve, reject) => browserSync.create().init({
    // https://www.browsersync.io/docs/options
    server: 'src/server.js',
    middleware: [server],
    open: !process.argv.includes('--silent'),
    ...isDebug ? {} : { notify: false, ui: false },
  }, (error, bs) => (error ? reject(error) : resolve(bs))));

Most helpful comment

Browsersync is not used for production. To run the production build you need:

$ yarn run build -- --release    # compile app in release mode
$ node build/server.js           # run the production server

However if you want to remove Browsersync from development server (yarn start) then you need to replace lines mentioned above with something like this:

server.listen(3000, () => {
  console.info('The development server is running at http://localhost:3000/');
});

All 7 comments

Browsersync is not used for production. To run the production build you need:

$ yarn run build -- --release    # compile app in release mode
$ node build/server.js           # run the production server

However if you want to remove Browsersync from development server (yarn start) then you need to replace lines mentioned above with something like this:

server.listen(3000, () => {
  console.info('The development server is running at http://localhost:3000/');
});

Pretty common beginner issue. May be we can add some sentinel that doing this makes no sense.

Does anyone have an example of this?

I think this was my point of confusion, I hope this clears things up

// Runs browser sync (and dev server)
yarn start -- -- release

// Doesn't run browser sync or dev server
yarn run build
node build/server.js

I'm going to go ahead and close this, thanks for the clarification!

Actually:

  • yarn start -- --release does not make sense, because yarn start is for development – with Browsersync, hot reload etc..
  • yarn run build does not make much sense too, because build is designed for stage or production.

So you shout use:

  • yarn start for development
  • yarn build -- --release for production

Since yarn start -- --release doesn't make sense, it probably shouldn't be listed in the getting started doc under browser sync, unless I'm misunderstanding the doc

edit from Getting Started

Note that the yarn start command launches the app in development mode, the compiled output files are not optimized and minimized in this case. You can use --release command line argument to check how your app works in release (production) mode:

$ yarn start -- --release

Edit 2:

If you need just to build the app (without running a dev server), simply run:
$ yarn run build

or, for a production build:
$ yarn run build -- --release

So what does this actually do, if anything? Do the minification of files but still run browser-sync and dev server?

Add more property ghostMode: false,

Was this page helpful?
0 / 5 - 0 ratings