Как использовать Gulp Browsersync с Django?

Впервые использую Gulp, и я следую паре руководств, которые, похоже, не совсем подходят для меня. У меня есть реальный базовый проект, и я просто хочу научиться использовать Gulp для стандартных вещей, таких как минимизация JavaScript/CSS, уменьшение изображений и синхронизация браузера.

Когда я запускаю свою задачу просмотра с помощью Browsersync, она переходит к правильному URL-адресу localhost:8000, но показывает Cannot GET / вместо отображения моей страницы. Как мне это исправить, чтобы я мог использовать Browsersync с Django?

Каталог файлов:

http://screencast.com/t/AkIOE3TO

gulpfile.js:

var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync').create();

gulp.task('sass', function() {
  return gulp.src('polls/static/polls/scss/**/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('polls/static/polls/css'))
    .pipe(browserSync.reload({
      stream: true
    }))
});

gulp.task('browserSync', function() {
  browserSync.init({
    server: "mysite",
    port: 8000
  });
});

gulp.task('watch', ['browserSync', 'sass'], function() {
  gulp.watch('polls/static/polls/scss/**/*.scss', ['sass']);
})

python django gulp browser-sync build-tools
person Kyle Truong    schedule 21.02.2016    source источник

Ответы (2)


arrow_upward
15
arrow_downward

Просто нужно было сделать еще одну задачу под названием runserver, которая запускается в cmd python manage.py runserver. Поставил задачу как одну из зависимостей для Browsersync, выставил прокси и порт и я был готов к работе.

var exec = require('child_process').exec не требовалось никаких дополнительных npm install. Я думаю, что это автоматически встроено.

var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync').create();
var exec = require('child_process').exec;

gulp.task('sass', function() {
  return gulp.src('polls/static/polls/scss/**/*.scss')
    .pipe(sass())
    .pipe(gulp.dest('polls/static/polls/css'))
    .pipe(browserSync.reload({
      stream: true
    }))
});

gulp.task('runserver', function() {
  var proc = exec('python manage.py runserver')
})

gulp.task('browserSync', ['runserver'], function() {
  browserSync.init({
    notify: false,
    port: 8000,
    proxy: 'localhost:8000'
  })
});

gulp.task('watch', ['browserSync', 'sass'], function() {
  gulp.watch('polls/static/polls/scss/**/*.scss', ['sass']);
  gulp.watch('polls/static/polls/scripts/**/*.js', browserSync.reload);
  gulp.watch('polls/templates/**/*.html', browserSync.reload);
})
person Kyle Truong    schedule 23.02.2016
comment
Обратите внимание, что этот синтаксис больше недействителен. gulp.task устарел, и следует использовать gulp.series или gulp.parallel. - person Jamie Marshall; 30.12.2020

arrow_upward

arrow_downward

person    schedule
comment
Ответы только на код не годятся. Пожалуйста, добавьте некоторое объяснение того, как работает ваш код. - person Madhur Bhaiya; 31.10.2018
comment
Я думаю, вам не хватает задачи gulp для запуска python manage.py runserver в качестве дочернего процесса. - person bayo opadeyi; 30.11.2018