Remove browser sync

This commit is contained in:
benoit 2022-06-12 14:53:59 +12:00
parent fe6d29006a
commit 937c4cc31a
3 changed files with 3 additions and 40 deletions

View File

@ -155,7 +155,7 @@ To run Celery locally, make sure redis-server is installed (instructions are ava
Sass Compilation & Live Reloading
---------------------------------
If you've opted for Gulp as front-end pipeline, the project comes configured with `Sass`_ compilation and `live reloading`_. As you change you Sass/JS source files, the task runner will automatically rebuild the corresponding CSS and JS assets and reload them in your browser without refreshing the page.
If you've opted for Gulp as front-end pipeline, the project comes configured with `Sass`_ compilation. As you change you Sass/JS source files, the task runner will automatically rebuild the corresponding CSS and JS assets.
#. Make sure that `Node.js`_ v16 is installed on your machine.
#. In the project root, install the JS dependencies with::
@ -166,13 +166,12 @@ If you've opted for Gulp as front-end pipeline, the project comes configured wit
$ npm run dev
The app will now run with live reloading enabled, applying front-end changes dynamically.
The app will now run Sass and javascript compilation. [django-browser-reload](https://github.com/adamchainz/django-browser-reload) will detect those changes and will refresh your current tab automatically
.. note:: The task will start 2 processes in parallel: the static assets build loop on one side, and the Django server on the other. You do NOT need to run Django as your would normally with ``manage.py runserver``.
.. _Node.js: http://nodejs.org/download/
.. _Sass: https://sass-lang.com/
.. _live reloading: https://browsersync.io
Summary
-------

View File

@ -8,14 +8,12 @@ const pjson = require('./package.json')
// Plugins
const autoprefixer = require('autoprefixer')
const browserSync = require('browser-sync').create()
const concat = require('gulp-concat')
const cssnano = require ('cssnano')
const imagemin = require('gulp-imagemin')
const pixrem = require('pixrem')
const plumber = require('gulp-plumber')
const postcss = require('gulp-postcss')
const reload = browserSync.reload
const rename = require('gulp-rename')
const sass = require('gulp-sass')(require('sass'))
const spawn = require('child_process').spawn
@ -123,42 +121,10 @@ function runServer(cb) {
}
{%- endif %}
// Browser sync server for live reload
function initBrowserSync() {
browserSync.init(
[
`${paths.css}/*.css`,
`${paths.js}/*.js`,
`${paths.templates}/*.html`
], {
{%- if cookiecutter.use_docker == 'y' %}
// https://www.browsersync.io/docs/options/#option-open
// Disable as it doesn't work from inside a container
open: false,
{%- endif %}
// https://www.browsersync.io/docs/options/#option-proxy
proxy: {
{%- if cookiecutter.use_docker == 'n' %}
target: '127.0.0.1:8000',
{%- else %}
target: 'django:8000',
{%- endif %}
proxyReq: [
function(proxyReq, req) {
// Assign proxy "host" header same as current request at Browsersync server
proxyReq.setHeader('Host', req.headers.host)
}
]
}
}
)
}
// Watch
function watchPaths() {
watch(`${paths.sass}/*.scss`{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}, styles)
watch(`${paths.templates}/**/*.html`{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}).on("change", reload)
watch([`${paths.js}/*.js`, `!${paths.js}/*.min.js`]{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}, scripts).on("change", reload)
watch([`${paths.js}/*.js`, `!${paths.js}/*.min.js`]{% if cookiecutter.windows == 'y' %}, { usePolling: true }{% endif %}, scripts)
}
// Generate all assets
@ -178,7 +144,6 @@ const dev = parallel(
runServer,
{%- endif %}
{%- endif %}
initBrowserSync,
watchPaths
)

View File

@ -7,7 +7,6 @@
"gulp-concat": "^2.6.1",
"@popperjs/core": "^2.10.2",
"autoprefixer": "^10.4.0",
"browser-sync": "^2.27.7",
"cssnano": "^5.0.11",
"gulp": "^4.0.2",
"gulp-imagemin": "^7.1.0",