S
S
Sergey Burduzha2020-12-10 20:40:52
phpstorm
Sergey Burduzha, 2020-12-10 20:40:52

How to force phpstorm to upload css files to hosting right after scss?

Good afternoon.
phpstorm has Upload change automaicaly - Always.

I run gulp through the task manager in the editor.
I change scss, I focus the storm on something else and push the scss file to the server, but not the css. If again I focus for the second time, then the css file is also pushed.

That is, after changing the scss file, I need to change the focus of the editor twice so that the css file is saved and goes to the server.

"use strict";
const gulp = require("gulp");
const webpack = require("webpack-stream");
const sass = require('gulp-sass');
const autoprefixer = require("gulp-autoprefixer");
const sourcemaps = require('gulp-sourcemaps');
const plumber = require("gulp-plumber");
const wait = require('gulp-wait'), notify = require("gulp-notify");
const browserSync = require("browser-sync");
let isDev = true;
let webpackConfig = {
  output: {
    filename: "webpack.js"
  },
  watch: false,
  module: {
    rules: [
      {
        test: /\.m?js$/,
        exclude: /(node_modules|bower_components)/,
        use: {
          loader: 'babel-loader',
          options: {
            presets: 
          }
        }
      }
    ]
  },
  mode: isDev ? 'development' : 'production',
  devtool: isDev ? 'eval-source-map' : 'none',
};
gulp.task('webpack', function () {
  return gulp.src('assets/js/src/main.js')
    .pipe(webpack(webpackConfig))
    .pipe(gulp.dest('assets/js/dist/'))
    .pipe(browserSync.reload({
      stream: true
    }));
});
gulp.task("scss", function () {
  return gulp.src('assets/scss/my.scss')
    .pipe(plumber())
    .pipe(sourcemaps.init())
    .pipe(wait(500))
    .pipe(sass().on('error', notify.onError(function (error) {
      return 'An error occurred while compiling sass.\nLook in the console for details.\n' + error;
    })))
    .pipe(autoprefixer({
      cascade: false
    }))
    .pipe(sourcemaps.write('.'))
    .pipe(gulp.dest('assets/css/'))
    .pipe(browserSync.reload({stream: true}));
});
gulp.task("watch", function () {
  gulp.watch('assets/scss/**/*.scss', gulp.series('scss'));
  gulp.watch('assets/js/src/**/*.js', gulp.series('webpack'));
});
gulp.task('browser-sync', function () {
  browserSync.init({
    proxy: {
      target: 'http://wc-base-ecommerce.host1670806.hostland.pro/',
      ws: true
    },
    reloadDelay: 2000,
    notify: true
  });
  // browserSync.init({
  // 	server: {
  // 		baseDir: siteDir
  // 	},
  // 	notify: true
  // });
  gulp.watch("**/*.html").on('change', browserSync.reload);
  gulp.watch("**/*.php").on('change', browserSync.reload);
  gulp.watch("**/*.css").on('change', browserSync.reload);
  gulp.watch("**/*.js").on('change', browserSync.reload);
});
// gulp.task('default', gulp.series('browser-sync'));
// gulp.task('default', gulp.parallel('scss', 'watch', 'browser-sync'));
// gulp.task('default', gulp.parallel('watch', 'browser-sync'));
gulp.task('default', gulp.series('webpack', 'scss', gulp.parallel('watch', 'browser-sync')));


Thanks in advance for your help.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question