我如何指定要使用的gulp文件?

所以我在这个站点上有两个gulpfiles,一个是整个项目,一个是监视和编译sass,一个是保存在项目子目录中的Foundation Emails项目。 当我尝试在这个Foundation子目录中运行任何脚本或gulp任务时,它将运行外部gulpfile的默认任务。 我怎么能这样做,当我在子目录中,它只使用该gulpfile?

最外面的gulpfile:

var gulp = require('gulp'); var sass = require('gulp-sass'); var watch = require('gulp-watch'); var autoprefixer = require('gulp-autoprefixer'); gulp.task('default', function() { return watch('ps_app/public/sass/*.scss') .pipe(sass()) .pipe(autoprefixer()) .pipe(gulp.dest('ps_app/public/css/custom')); }); gulp.task('sass', function() { return gulp.src('ps_app/public/sass/*.scss') .pipe(sass()) .pipe(autoprefixer()) .pipe(gulp.dest('ps_app/public/css/custom')); }); 

基础邮件子目录gulpfile:

 import gulp from 'gulp'; import plugins from 'gulp-load-plugins'; import browser from 'browser-sync'; import rimraf from 'rimraf'; import panini from 'panini'; import yargs from 'yargs'; import lazypipe from 'lazypipe'; import inky from 'inky'; import fs from 'fs'; import siphon from 'siphon-media-query'; import path from 'path'; import merge from 'merge-stream'; import beep from 'beepbeep'; import colors from 'colors'; const $ = plugins(); // Look for the --production flag const PRODUCTION = !!(yargs.argv.production); // Declar var so that both AWS and Litmus task can use it. var CONFIG; // Build the "dist" folder by running all of the above tasks gulp.task('build', gulp.series(clean, pages, sass, images, inline)); // Build emails, run the server, and watch for file changes gulp.task('default', gulp.series('build', server, watch)); // Build emails, then send to litmus gulp.task('litmus', gulp.series('build', creds, aws, litmus)); // Build emails, then zip gulp.task('zip', gulp.series('build', zip)); // Delete the "dist" folder // This happens every time a build starts function clean(done) { rimraf('dist', done); } // Compile layouts, pages, and partials into flat HTML files // Then parse using Inky templates function pages() { return gulp.src('src/pages/**/*.html') .pipe(panini({ root: 'src/pages', layouts: 'src/layouts', partials: 'src/partials', helpers: 'src/helpers' })) .pipe(inky()) .pipe(gulp.dest('dist')); } // Reset Panini's cache of layouts and partials function resetPages(done) { panini.refresh(); done(); } // Compile Sass into CSS function sass() { return gulp.src('src/assets/scss/app.scss') .pipe($.if(!PRODUCTION, $.sourcemaps.init())) .pipe($.sass({ includePaths: ['node_modules/foundation-emails/scss'] }).on('error', $.sass.logError)) .pipe($.if(!PRODUCTION, $.sourcemaps.write())) .pipe(gulp.dest('dist/css')); } // Copy and compress images function images() { return gulp.src('src/assets/img/**/*') .pipe($.imagemin()) .pipe(gulp.dest('./dist/assets/img')); } // Inline CSS and minify HTML function inline() { return gulp.src('dist/**/*.html') .pipe($.if(PRODUCTION, inliner('dist/css/app.css'))) .pipe(gulp.dest('dist')); } // Start a server with LiveReload to preview the site in function server(done) { browser.init({ server: 'dist' }); done(); } // Watch for file changes function watch() { gulp.watch('src/pages/**/*.html').on('change', gulp.series(pages, inline, browser.reload)); gulp.watch(['src/layouts/**/*', 'src/partials/**/*']).on('change', gulp.series(resetPages, pages, inline, browser.reload)); gulp.watch(['../scss/**/*.scss', 'src/assets/scss/**/*.scss']).on('change', gulp.series(resetPages, sass, pages, inline, browser.reload)); gulp.watch('src/assets/img/**/*').on('change', gulp.series(images, browser.reload)); } // Inlines CSS into HTML, adds media query CSS into the <style> tag of the email, and compresses the HTML function inliner(css) { var css = fs.readFileSync(css).toString(); var mqCss = siphon(css); var pipe = lazypipe() .pipe($.inlineCss, { applyStyleTags: false, removeStyleTags: false, removeLinkTags: false }) .pipe($.replace, '<!-- <style> -->', `<style>${mqCss}</style>`) .pipe($.replace, '<link rel="stylesheet" type="text/css" href="css/app.css">', '') .pipe($.htmlmin, { collapseWhitespace: true, minifyCSS: true }); return pipe(); } // Ensure creds for Litmus are at least there. function creds(done) { var configPath = './config.json'; try { CONFIG = JSON.parse(fs.readFileSync(configPath)); } catch(e) { beep(); console.log('[AWS]'.bold.red + ' Sorry, there was an issue locating your config.json. Please see README.md'); process.exit(); } done(); } // Post images to AWS S3 so they are accessible to Litmus test function aws() { var publisher = !!CONFIG.aws ? $.awspublish.create(CONFIG.aws) : $.awspublish.create(); var headers = { 'Cache-Control': 'max-age=315360000, no-transform, public' }; return gulp.src('./dist/assets/img/*') // publisher will add Content-Length, Content-Type and headers specified above // If not specified it will set x-amz-acl to public-read by default .pipe(publisher.publish(headers)) // create a cache file to speed up consecutive uploads //.pipe(publisher.cache()) // print upload updates to console .pipe($.awspublish.reporter()); } // Send email to Litmus for testing. If no AWS creds then do not replace img urls. function litmus() { var awsURL = !!CONFIG && !!CONFIG.aws && !!CONFIG.aws.url ? CONFIG.aws.url : false; return gulp.src('dist/**/*.html') .pipe($.if(!!awsURL, $.replace(/=('|")(\/?assets\/img)/g, "=$1"+ awsURL))) .pipe($.litmus(CONFIG.litmus)) .pipe(gulp.dest('dist')); } // Copy and compress into Zip function zip() { var dist = 'dist'; var ext = '.html'; function getHtmlFiles(dir) { return fs.readdirSync(dir) .filter(function(file) { var fileExt = path.join(dir, file); var isHtml = path.extname(fileExt) == ext; return fs.statSync(fileExt).isFile() && isHtml; }); } var htmlFiles = getHtmlFiles(dist); var moveTasks = htmlFiles.map(function(file){ var sourcePath = path.join(dist, file); var fileName = path.basename(sourcePath, ext); var moveHTML = gulp.src(sourcePath) .pipe($.rename(function (path) { path.dirname = fileName; return path; })); var moveImages = gulp.src(sourcePath) .pipe($.htmlSrc({ selector: 'img'})) .pipe($.rename(function (path) { path.dirname = fileName + '/assets/img'; return path; })); return merge(moveHTML, moveImages) .pipe($.zip(fileName+ '.zip')) .pipe(gulp.dest('dist')); }); return merge(moveTasks); } 

我运行的具体任务是npm startnpm run build ,它们在我的package.json中的基础邮件所在的子目录中执行这些任务:

  "scripts": { "start": "gulp", "build": "gulp --production", "zip": "gulp zip --production", "litmus": "gulp litmus --production" }, 

谢谢你的帮助。

您可以使用--gulpfile CLI参数手动指定gulp文件:

--gulpfile <gulpfile path>会手动设置--gulpfile <gulpfile path> 。 有用的,如果你有多个gulpfiles。 这将把CWD设置为gulpfile目录

资源

Interesting Posts