GULP的新功能-是否有必要将所有文件从src目录复制到项目的dist目录?

GULP的新功能-是否有必要将所有文件从src目录复制到项目的dist目录?

问题描述:

我已经使用GULP 4一周多了,以前从未使用过. 下面的代码是我已经玩了一周的代码,以便它将完成我所要求的工作. 我的问题是,是否有必要将项目中的每个文件从src复制到dist目录,尤其是在更改时,因为我有60多个php文件,并且在更改时更新每个php文件并不能使我感到效率高. 首先,有必要在更改时将所有项目文件从src复制到dist. 其次,有没有一种方法可以只更新src目录中已修改的一个文件? 过去,我没有考虑使用自动工具,例如GULP.重点是在开发过程中使用此类工具以节省时间,以及有助于该原因的其他好处. 作为初学者,将需要一些时间来欣赏这些好处. 您可能会对我给出的代码进行任何改进,我们将不胜感激. 亲切的问候

I have been using GULP 4 for little over a week now and have never used it before. The code below is what I have been playing around with for a week now, so that it will do the job I have asked of it. My question, is it necessary to copy every file in a project from the src to dist directory, especially on change, as I have over 60 php files, and to update every php file on change does not strike me as being efficient. First, is necessary to copy all project files from the src to dist on change. Second, is there a way to just update the one file that has been modified in the src directory? In the past I haven't looked at using automated tools such as GULP, however; the emphasis is on using such tools in the development process to save time, along with other benefits that help the cause. As a beginner, it is going to take some time to appreciate these benefits. Any improvements that you may see with respect with the code I have given would be much appreciated. Kindest Regards

const gulp = require('gulp');
const php = require('gulp-connect-php');
const sass = require('gulp-sass');
const uglify = require('gulp-uglify');
const lineec = require('gulp-line-ending-corrector');
const browserSync = require('browser-sync').create();

const styleSRC = './src/scss/**/*.scss';
const styleDIST = './dist/css';

const jsSRC = 'src/js/**/*.js';
const jsDIST = './dist/js';

const phpSRC = 'src/php/**/*.php';
const phpDIST = './dist/php';

const htmlSRC = 'src/html/**/*.html';
const htmlDIST = './dist/html';

function style()
{
    return gulp.src(styleSRC)
    .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
    .pipe(gulp.dest(styleDIST))
    .pipe(browserSync.stream());
}

function javascript() {
    return gulp.src(jsSRC)
    .pipe(uglify())
    .pipe(lineec())
    .pipe(gulp.dest(jsDIST));
  }

  function phpscript() {
    return gulp.src(phpSRC)
    .pipe(gulp.dest(phpDIST));
  }

function server()
{
    php.server({base:'./src/php', port:8010, keepalive:true});
}

function sync()
{
    browserSync.init({
        proxy: "http://lansdownelions/src/php/login.php",
        baseDir: './src/php',
        open: true,
        notify: false
    });
}

function watch()
{
    gulp.watch(styleSRC, style);
    gulp.watch(jsSRC, javascript);
    gulp.watch(jsSRC).on('change', browserSync.reload);
    gulp.watch(phpSRC, phpscript);
    gulp.watch(phpSRC).on('change', browserSync.reload);
    gulp.watch(htmlSRC).on('change', browserSync.reload);
}

exports.style = style;
exports.javascript = javascript;
exports.phpscript = phpscript;
exports.server = server;
exports.sync = sync;
exports.watch = watch;

var build = gulp.parallel(style, javascript, phpscript, sync, server, watch);
gulp.task('default', build);

根据帖子解决了我想要实现的目标.为此,我所需要做的就是用下面显示的额外代码行更改其中一个功能. 此更改的工作原理很吸引人,而好处是,dist子文件夹中的文件仅在日期/时间戳不同时才会被覆盖.这样可以节省从命令行运行$ gulp default的时间,如果文件没有更改,则在运行时没有文件复制到dist子目录. 我要感谢每个人的有效贡献,这确实在不同领域为我提供了帮助. 亲切的问候

Solved what I wanted to achieve based on the post. To do this, all I needed to do was to change one of the functions with an extra line of code shown below. This change works like a charm, and as a benefit, the files in the dist sub-folder, only appear to overwrite if the date/timestamp are different. This saves time when running $ gulp default from the command line where no files copy to the dist sub-directories when run, if the files have not changed. I want to thank each and everyone for the valid contributions, which really has helped me in different areas with gulp. Kindest Regards

//original function code:
function phpscript()
{
    return gulp.src(phpSRC)
    .pipe(gulp.dest(phpDIST));
}


// changed function code to:
function phpscript()
{
    return gulp.src(phpSRC)
    .pipe(changed(phpDIST))
    .pipe(gulp.dest(phpDIST));
}