vagrant@homestead:~/sites/nystudio107$ tree -a -L 2 -I "node_modules|.git|scripts|.DS_Store|.idea" .
.
├── .babelrc
├── browserslist
├── build
│   ├── fonts
│   ├── html
│   └── js
├── craft
├── .csslintrc
├── .env.php
├── example.env.php
├── .git
├── .gitignore
├── .gitmodules
├── gulpfile.js
├── node_modules
├── package.json
├── public
│   ├── css
│   ├── favicon.ico
│   ├── favicon.png
│   ├── fonts
│   ├── htaccess
│   ├── imager
│   ├── img
│   ├── index.php
│   ├── js
│   ├── webappmanifest.json
│   └── web.config
├── readme.txt
├── scripts
├── src
│   ├── conf
│   ├── css
│   ├── fontello
│   ├── fonts
│   ├── img
│   ├── js
│   └── json
├── templates -> craft/templates/
└── yarn.lock

27 directories, 20 files

// 패키지 변수
const pkg = require("./package.json")

// gulp
const gulp = require("gulp")

// devDependencies에 있는 모든 플러그인을 $ 변수에 로딩합니다
const $ = require("gulp-load-plugins")({
  pattern: ["*"],
  scope: ["devDependencies"],
})

const onError = err => console.log(err)

const banner = [
  "/**",
  " * @project        <%= pkg.name %>",
  " * @author         <%= pkg.author %>",
  " * @build          " + $.moment().format("llll") + " ET",
  " * @release        " +
    $.gitRevSync.long() +
    " [" +
    $.gitRevSync.branch() +
    "]",
  " * @copyright      Copyright (c) " +
    $.moment().format("YYYY") +
    ", <%= pkg.copyright %>",
  " *",
  " */",
  "",
].join("\n")

// 기본 작업
gulp.task("default", ["css", "js"], () => {
  $.livereload.listen()
  gulp.watch([pkg.paths.src.scss + "**/*.scss"], ["css"])
  gulp.watch([pkg.paths.src.css + "**/*.css"], ["css"])
  gulp.watch([pkg.paths.src.js + "**/*.js"], ["js"])
  gulp.watch([pkg.paths.templates + "**/*.{html,htm,twig}"], () => {
    gulp
      .src(pkg.paths.templates)
      .pipe($.plumber({ errorHandler: onError }))
      .pipe($.livereload())
  })
})

// 프로덕션 빌드
gulp.task("build", [
  "download",
  "default",
  "favicons",
  "imagemin",
  "fonts",
  "criticalcss",
])

// scss = paths를 포함한 build 폴더로 scss를 빌드하고 소스맵을 만듭니다
gulp.task("scss", () => {
  $.fancyLog("-> Compiling scss")
  return gulp
    .src(pkg.paths.src.scss + pkg.vars.scssName)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.sourcemaps.init({ loadMaps: true }))
    .pipe(
      $.sass({
        includePaths: pkg.paths.scss,
      }).on("error", $.sass.logError)
    )
    .pipe($.cached("sass_compile"))
    .pipe($.autoprefixer())
    .pipe($.sourcemaps.write("./"))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.build.css))
})

// css 작업 - 배포용 CSS를 public css 폴더로 하나로 합치고 최소화하고 여기에 배너를 추가합니다
gulp.task("css", ["scss"], () => {
  $.fancyLog("-> Building css")
  return gulp
    .src(pkg.globs.distCss)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.newer({ dest: pkg.paths.dist.css + pkg.vars.siteCssName }))
    .pipe($.print())
    .pipe($.sourcemaps.init({ loadMaps: true }))
    .pipe($.concat(pkg.vars.siteCssName))
    .pipe(
      $.cssnano({
        discardComments: {
          removeAll: true,
        },
        discardDuplicates: true,
        discardEmpty: true,
        minifyFontValues: true,
        minifySelectors: true,
      })
    )
    .pipe($.header(banner, { pkg: pkg }))
    .pipe($.sourcemaps.write("./"))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.dist.css))
    .pipe($.filter("**/*.css"))
    .pipe($.livereload())
})

# Supported browsers

last 3 versions
iOS >= 8

// Prism js 작업 - prismjs(번역주: 소스코드 하이라이트) 자바스크립트와 컨피그 파일을 하나의 번들로 합칩니다
gulp.task("prism-js", () => {
  $.fancyLog("-> Building prism.min.js...")
  return gulp
    .src(pkg.globs.prismJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.newer({ dest: pkg.paths.build.js + "prism.min.js" }))
    .pipe($.concat("prism.min.js"))
    .pipe($.uglify())
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.build.js))
})

// 바벨 js 작업 - 자바스크립트를 빌드 폴더로 트랜스파일 합니다
gulp.task("js-babel", () => {
  $.fancyLog("-> Transpiling Javascript via Babel...")
  return gulp
    .src(pkg.globs.babelJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.newer({ dest: pkg.paths.build.js }))
    .pipe($.babel())
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.build.js))
})

// 인라인 js 작업 - 인라인 자바스크립트로 템플릿 경로의 _inlinejs 로 최소화 합니다
gulp.task("js-inline", () => {
  $.fancyLog("-> Copying inline js")
  return gulp
    .src(pkg.globs.inlineJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe(
      $.if(
        ["*.js", "!*.min.js"],
        $.newer({ dest: pkg.paths.templates + "_inlinejs", ext: ".min.js" }),
        $.newer({ dest: pkg.paths.templates + "_inlinejs" })
      )
    )
    .pipe($.if(["*.js", "!*.min.js"], $.uglify()))
    .pipe($.if(["*.js", "!*.min.js"], $.rename({ suffix: ".min" })))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.templates + "_inlinejs"))
})

// js 작업 - public js 폴더로 배포 자바스크립트를 최소화하고 여기에 배너를 추가합니다
gulp.task("js", ["js-inline", "js-babel", "prism-js"], () => {
  $.fancyLog("-> Building js")
  return gulp
    .src(pkg.globs.distJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe(
      $.if(
        ["*.js", "!*.min.js"],
        $.newer({ dest: pkg.paths.dist.js, ext: ".min.js" }),
        $.newer({ dest: pkg.paths.dist.js })
      )
    )
    .pipe($.if(["*.js", "!*.min.js"], $.uglify()))
    .pipe($.if(["*.js", "!*.min.js"], $.rename({ suffix: ".min" })))
    .pipe($.header(banner, { pkg: pkg }))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.dist.js))
    .pipe($.filter("**/*.js"))
    .pipe($.livereload())
})

{
  "presets": ["es2015"],
  "compact": true
}

// 파비콘 생성 작업
gulp.task("favicons-generate", () => {
  $.fancyLog("-> Generating favicons")
  return gulp
    .src(pkg.paths.favicon.src)
    .pipe(
      $.favicons({
        appName: pkg.name,
        appDescription: pkg.description,
        developerName: pkg.author,
        developerURL: pkg.urls.live,
        background: "#FFFFFF",
        path: pkg.paths.favicon.path,
        url: pkg.site_url,
        display: "standalone",
        orientation: "portrait",
        version: pkg.version,
        logging: false,
        online: false,
        html: pkg.paths.build.html + "favicons.html",
        replace: true,
        icons: {
          android: false, // 안드로이드 홈스크린 아이콘 생성. 불리언
          appleIcon: true, // 애플 터치 아이콘 생성. 불리언
          appleStartup: false, // 에플 시작 이미지 생성. 불리언
          coast: true, // 오페라 Coast 아이콘 생성. 불리언
          favicons: true, // 기본 파비콘 생성. 불리언
          firefox: true, // 파이어폭스 운영체제 아이콘 생성. 불리언
          opengraph: false, // 페이스북 오픈 그래프 이미지 생성. 불리언
          twitter: false, // 트위터 써머리 카드 이미지 생성. 불리언
          windows: true, // 윈도우즈 8 타이틀 아이콘 생성. 불리언
          yandex: true, // Yandex 브라우져 아이콘 생성. 불리언
        },
      })
    )
    .pipe(gulp.dest(pkg.paths.favicon.dest))
})

// 파비콘 복사 태스크
gulp.task("favicons", ["favicons-generate"], () => {
  $.fancyLog("-> Copying favicon.ico")
  return gulp
    .src(pkg.globs.siteIcon)
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.dist.base))
})

// imagemin 태스크
gulp.task("imagemin", () => {
  return gulp
    .src(pkg.paths.dist.img + "**/*.{png,jpg,jpeg,gif,svg}")
    .pipe(
      $.imagemin({
        progressive: true,
        interlaced: true,
        optimizationLevel: 7,
        svgoPlugins: [{ removeViewBox: false }],
        verbose: true,
        use: [],
      })
    )
    .pipe(gulp.dest(pkg.paths.dist.img))
})

// fontello 생성 태스크
gulp.task("generate-fontello", () => {
  return gulp
    .src(pkg.paths.src.fontello + "config.json")
    .pipe($.fontello())
    .pipe($.print())
    .pipe(gulp.dest(pkg.paths.build.fontello))
})

// 서체 복사 태스크
gulp.task("fonts", ["generate-fontello"], () => {
  return gulp.src(pkg.globs.fonts).pipe(gulp.dest(pkg.paths.dist.fonts))
})

// 배열에 있는 데이터를 순차적으로 처리합니다
// nths 아이템 콜벡이후에 n_1 아이템을 이동하면서 말이죠
function doSynchronousLoop(data, processData, done) {
  if (data.length > 0) {
    const loop = (data, i, processData, done) => {
      processData(data[i], i, () => {
        if (++i < data.length) {
          loop(data, i, processData, done)
        } else {
          done()
        }
      })
    }
    loop(data, 0, processData, done)
  } else {
    done()
  }
}

// 한번에 criticla path CSS 처리합니다
function processCriticalCSS(element, i, callback) {
  const criticalSrc = pkg.urls.critical + element.url
  const criticalDest =
    pkg.paths.templates + element.template + "_critical.min.css"

  let criticalWidth = 1200
  let criticalHeight = 1200
  if (element.template.indexOf("amp_") !== -1) {
    criticalWidth = 600
    criticalHeight = 19200
  }
  $.fancyLog(
    "-> Generating critical CSS: " +
      $.chalk.cyan(criticalSrc) +
      " -> " +
      $.chalk.magenta(criticalDest)
  )
  $.critical.generate(
    {
      src: criticalSrc,
      dest: criticalDest,
      inline: false,
      ignore: [],
      base: pkg.paths.dist.base,
      css: [pkg.paths.dist.css + pkg.vars.siteCssName],
      minify: true,
      width: criticalWidth,
      height: criticalHeight,
    },
    (err, output) => {
      if (err) {
        $.fancyLog($.chalk.magenta(err))
      }
      callback()
    }
  )
}

// 크리티컬 CSS 태스크
gulp.task("criticalcss", ["css"], callback => {
  doSynchronousLoop(pkg.globs.critical, processCriticalCSS, () => {
    // 모두 완료
    callback()
  })
})

// Run pa11y accessibility tests on each template
function processAccessibility(element, i, callback) {
  const accessibilitySrc = pkg.urls.critical + element.url
  const cliReporter = require("./node_modules/pa11y/reporter/cli.js")
  const options = {
    log: cliReporter,
    ignore: ["notice", "warning"],
  }
  const test = $.pa11y(options)

  $.fancyLog(
    "-> Checking Accessibility for URL: " + $.chalk.cyan(accessibilitySrc)
  )
  test.run(accessibilitySrc, (error, results) => {
    cliReporter.results(results, accessibilitySrc)
    callback()
  })
}

// accessibility task
gulp.task("a11y", callback => {
  doSynchronousLoop(pkg.globs.critical, processAccessibility, () => {
    // all done
    callback()
  })
})

// 한번에 하나씩 다운로드를 처리합니다
function processDownload(element, i, callback) {
  const downloadSrc = element.url
  const downloadDest = element.dest

  $.fancyLog(
    "-> Downloading URL: " +
      $.chalk.cyan(downloadSrc) +
      " -> " +
      $.chalk.magenta(downloadDest)
  )
  $.download(downloadSrc).pipe(gulp.dest(downloadDest))
  callback()
}

// 다운로드 태스크
gulp.task("download", callback => {
  doSynchronousLoop(pkg.globs.download, processDownload, () => {
    // all done
    callback()
  })
})

// 패키지 변수
const pkg = require("./package.json")

// gulp
const gulp = require("gulp")

// devDependencies에 있는 모든 플러그인을 $ 변수에 로딩합니다
const $ = require("gulp-load-plugins")({
  pattern: ["*"],
  scope: ["devDependencies"],
})

const onError = err => {
  console.log(err)
}

const banner = [
  "/**",
  " * @project        <%= pkg.name %>",
  " * @author         <%= pkg.author %>",
  " * @build          " + $.moment().format("llll") + " ET",
  " * @release        " +
    $.gitRevSync.long() +
    " [" +
    $.gitRevSync.branch() +
    "]",
  " * @copyright      Copyright (c) " +
    $.moment().format("YYYY") +
    ", <%= pkg.copyright %>",
  " *",
  " */",
  "",
].join("\n")

// scss - paths를 포함한 build 폴더로 scss를 빌드하고 소스맵을 만듭니다
gulp.task("scss", () => {
  $.fancyLog("-> Compiling scss")
  return gulp
    .src(pkg.paths.src.scss + pkg.vars.scssName)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.sourcemaps.init({ loadMaps: true }))
    .pipe(
      $.sass({
        includePaths: pkg.paths.scss,
      }).on("error", $.sass.logError)
    )
    .pipe($.cached("sass_compile"))
    .pipe($.autoprefixer())
    .pipe($.sourcemaps.write("./"))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.build.css))
})

// css 작업 - 배포용 CSS를 public css 폴더로 하나로 합치고 최소화하고 여기에 배너를 추가합니다
gulp.task("css", ["scss"], () => {
  $.fancyLog("-> Building css")
  return gulp
    .src(pkg.globs.distCss)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.newer({ dest: pkg.paths.dist.css + pkg.vars.siteCssName }))
    .pipe($.print())
    .pipe($.sourcemaps.init({ loadMaps: true }))
    .pipe($.concat(pkg.vars.siteCssName))
    .pipe(
      $.cssnano({
        discardComments: {
          removeAll: true,
        },
        discardDuplicates: true,
        discardEmpty: true,
        minifyFontValues: true,
        minifySelectors: true,
      })
    )
    .pipe($.header(banner, { pkg: pkg }))
    .pipe($.sourcemaps.write("./"))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.dist.css))
    .pipe($.filter("**/*.css"))
    .pipe($.livereload())
})

// Prism js 작업 - prismjs(번역주: 소스코드 하이라이트) 자바스크립트와 컨피그 파일을 하나의 번들로 합칩니다
gulp.task("prism-js", () => {
  $.fancyLog("-> Building prism.min.js...")
  return gulp
    .src(pkg.globs.prismJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.newer({ dest: pkg.paths.build.js + "prism.min.js" }))
    .pipe($.concat("prism.min.js"))
    .pipe($.uglify())
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.build.js))
})

// 바벨 js 작업 - 자바스크립트를 빌드 폴더로 트랜스파일 합니다
gulp.task("js-babel", () => {
  $.fancyLog("-> Transpiling Javascript via Babel...")
  return gulp
    .src(pkg.globs.babelJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.newer({ dest: pkg.paths.build.js }))
    .pipe($.babel())
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.build.js))
})

// 컴포넌트 - VueJS 컴포넌트인 .vue 파일 빌드
gulp.task("components", () => {
  $.fancyLog("-> Compiling Vue Components")
  return gulp
    .src(pkg.globs.components)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe($.newer({ dest: pkg.paths.build.js, ext: ".js" }))
    .pipe($.vueify({}))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.build.js))
})

// 인라인 js 작업 - 인라인 자바스크립트로 템플릿 경로의 _inlinejs 로 최소화 합니다
gulp.task("js-inline", () => {
  $.fancyLog("-> Copying inline js")
  return gulp
    .src(pkg.globs.inlineJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe(
      $.if(
        ["*.js", "!*.min.js"],
        $.newer({ dest: pkg.paths.templates + "_inlinejs", ext: ".min.js" }),
        $.newer({ dest: pkg.paths.templates + "_inlinejs" })
      )
    )
    .pipe($.if(["*.js", "!*.min.js"], $.uglify()))
    .pipe($.if(["*.js", "!*.min.js"], $.rename({ suffix: ".min" })))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.templates + "_inlinejs"))
    .pipe($.filter("**/*.js"))
    .pipe($.livereload())
})

// js 작업 - public js 폴더로 배포 자바스크립트를 최소화하고 여기에 배너를 추가합니다
gulp.task("js", ["js-inline", "js-babel", "prism-js"], () => {
  $.fancyLog("-> Building js")
  return gulp
    .src(pkg.globs.distJs)
    .pipe($.plumber({ errorHandler: onError }))
    .pipe(
      $.if(
        ["*.js", "!*.min.js"],
        $.newer({ dest: pkg.paths.dist.js, ext: ".min.js" }),
        $.newer({ dest: pkg.paths.dist.js })
      )
    )
    .pipe($.if(["*.js", "!*.min.js"], $.uglify()))
    .pipe($.if(["*.js", "!*.min.js"], $.rename({ suffix: ".min" })))
    .pipe($.header(banner, { pkg: pkg }))
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.dist.js))
    .pipe($.filter("**/*.js"))
    .pipe($.livereload())
})

// 배열에 있는 데이터를 순차적으로 처리 (n번째 아이템 콜백이후 n+1번째 아이템으로 이동하면서)
function doSynchronousLoop(data, processData, done) {
  if (data.length > 0) {
    const loop = (data, i, processData, done) => {
      processData(data[i], i, () => {
        if (++i < data.length) {
          loop(data, i, processData, done)
        } else {
          done()
        }
      })
    }
    loop(data, 0, processData, done)
  } else {
    done()
  }
}

// 한번에 하나씩 크리티컬 패스 CSS 처리
function processCriticalCSS(element, i, callback) {
  const criticalSrc = pkg.urls.critical + element.url
  const criticalDest =
    pkg.paths.templates + element.template + "_critical.min.css"

  let criticalWidth = 1200
  let criticalHeight = 1200
  if (element.template.indexOf("amp_") !== -1) {
    criticalWidth = 600
    criticalHeight = 19200
  }
  $.fancyLog(
    "-> Generating critical CSS: " +
      $.chalk.cyan(criticalSrc) +
      " -> " +
      $.chalk.magenta(criticalDest)
  )
  $.critical.generate(
    {
      src: criticalSrc,
      dest: criticalDest,
      inline: false,
      ignore: [],
      base: pkg.paths.dist.base,
      css: [pkg.paths.dist.css + pkg.vars.siteCssName],
      minify: true,
      width: criticalWidth,
      height: criticalHeight,
    },
    (err, output) => {
      if (err) {
        $.fancyLog($.chalk.magenta(err))
      }
      callback()
    }
  )
}

// 크리티컬 css 태스크
gulp.task("criticalcss", ["css"], callback => {
  doSynchronousLoop(pkg.globs.critical, processCriticalCSS, () => {
    // all done
    callback()
  })
})

// 한번에 하나씩 다운로드 처리
function processDownload(element, i, callback) {
  const downloadSrc = element.url
  const downloadDest = element.dest

  $.fancyLog(
    "-> Downloading URL: " +
      $.chalk.cyan(downloadSrc) +
      " -> " +
      $.chalk.magenta(downloadDest)
  )
  $.download(downloadSrc).pipe(gulp.dest(downloadDest))
  callback()
}

// 다운로드 태스크
gulp.task("download", callback => {
  doSynchronousLoop(pkg.globs.download, processDownload, () => {
    // all done
    callback()
  })
})

// 각 템플릿에 pa11y 접근성 테스트 실행
function processAccessibility(element, i, callback) {
  const accessibilitySrc = pkg.urls.critical + element.url
  const cliReporter = require("./node_modules/pa11y/reporter/cli.js")
  const options = {
    log: cliReporter,
    ignore: ["notice", "warning"],
  }
  const test = $.pa11y(options)

  $.fancyLog(
    "-> Checking Accessibility for URL: " + $.chalk.cyan(accessibilitySrc)
  )
  test.run(accessibilitySrc, (error, results) => {
    cliReporter.results(results, accessibilitySrc)
    callback()
  })
}

// 접근성 태스크
gulp.task("a11y", callback => {
  doSynchronousLoop(pkg.globs.critical, processAccessibility, () => {
    // all done
    callback()
  })
})

// 파비콘 생서 태스크
gulp.task("favicons-generate", () => {
  $.fancyLog("-> Generating favicons")
  return gulp
    .src(pkg.paths.favicon.src)
    .pipe(
      $.favicons({
        appName: pkg.name,
        appDescription: pkg.description,
        developerName: pkg.author,
        developerURL: pkg.urls.live,
        background: "#FFFFFF",
        path: pkg.paths.favicon.path,
        url: pkg.site_url,
        display: "standalone",
        orientation: "portrait",
        version: pkg.version,
        logging: false,
        online: false,
        html: pkg.paths.build.html + "favicons.html",
        replace: true,
        icons: {
          android: false, // 안드로이드 홈스크린 아이콘 생성. 불리언
          appleIcon: true, // 애플 터치 아이콘 생성. 불리언
          appleStartup: false, // 에플 시작 이미지 생성. 불리언
          coast: true, // 오페라 Coast 아이콘 생성. 불리언
          favicons: true, // 기본 파비콘 생성. 불리언
          firefox: true, // 파이어폭스 운영체제 아이콘 생성. 불리언
          opengraph: false, // 페이스북 오픈 그래프 이미지 생성. 불리언
          twitter: false, // 트위터 써머리 카드 이미지 생성. 불리언
          windows: true, // 윈도우즈 8 타이틀 아이콘 생성. 불리언
          yandex: true, // Yandex 브라우져 아이콘 생성. 불리언
        },
      })
    )
    .pipe(gulp.dest(pkg.paths.favicon.dest))
})

// 파비콘 복사 태스크
gulp.task("favicons", ["favicons-generate"], () => {
  $.fancyLog("-> Copying favicon.ico")
  return gulp
    .src(pkg.globs.siteIcon)
    .pipe($.size({ gzip: true, showFiles: true }))
    .pipe(gulp.dest(pkg.paths.dist.base))
})

// imagemin 태스크
gulp.task("imagemin", () => {
  return gulp
    .src(pkg.paths.dist.img + "**/*.{png,jpg,jpeg,gif,svg}")
    .pipe(
      $.imagemin({
        progressive: true,
        interlaced: true,
        optimizationLevel: 7,
        svgoPlugins: [{ removeViewBox: false }],
        verbose: true,
        use: [],
      })
    )
    .pipe(gulp.dest(pkg.paths.dist.img))
})

// fontello 생성 태스크
gulp.task("generate-fontello", () => {
  return gulp
    .src(pkg.paths.src.fontello + "config.json")
    .pipe($.fontello())
    .pipe($.print())
    .pipe(gulp.dest(pkg.paths.build.fontello))
})

// 서체 복사 태스크
gulp.task("fonts", ["generate-fontello"], () => {
  return gulp.src(pkg.globs.fonts).pipe(gulp.dest(pkg.paths.dist.fonts))
})

// 기본 테스크
gulp.task("default", ["css", "js"], () => {
  $.livereload.listen()
  gulp.watch([pkg.paths.src.scss + "**/*.scss"], ["css"])
  gulp.watch([pkg.paths.src.css + "**/*.css"], ["css"])
  gulp.watch([pkg.paths.src.js + "**/*.js"], ["js"])
  gulp.watch([pkg.paths.templates + "**/*.{html,htm,twig}"], () => {
    gulp
      .src(pkg.paths.templates)
      .pipe($.plumber({ errorHandler: onError }))
      .pipe($.livereload())
  })
})

// 프로덕션 빌드
gulp.task("build", [
  "download",
  "default",
  "favicons",
  "imagemin",
  "fonts",
  "criticalcss",
])