天天看點

gulp 重命名 vue-cli3的釋出檔案

目标:

打包後 dist 裡面檔案 webpackJsonp 改為 webpackJsonLvsp (改用 gulp 重命名)

前置條件:

npm install --save-dev gulp gulp-replace

不多說,上代碼

const gulp = require('gulp')

const replace = require('gulp-replace')

const fs = require('fs')

const join = require('path').join

const baseUrl = 'dist/static/js'

const putBackPath = 'dist/static/js'

let filesArr = getJsonFiles(baseUrl)

// console.log(filesArr)

// 擷取目錄下的所有檔案名,傳回數組

function getJsonFiles(jsonPath) {

  let jsonFiles = []

  function findJsonFile(path) {

    let files = fs.readdirSync(path)

    files.forEach(function(item, index) {

      let fPath = join(path, item)

      let stat = fs.statSync(fPath)

      if (stat.isDirectory() === true) {

        findJsonFile(fPath)

      }

      if (stat.isFile() === true) {

        jsonFiles.push(fPath)

      }

    })

  }

  findJsonFile(jsonPath)

  jsonFiles = jsonFiles.map(item => {

    let str = item.split('\\').join('/')

    return str

  })

  return jsonFiles

}

gulp.task('default', function(done) {

  console.log('打包後 dist 裡面檔案 webpackJsonp 改為 webpackJsonLvsp')

  for (let path of filesArr) {

    gulp

      .src(path)

      // See https://mdn.io/string.replace#Specifying_a_string_as_a_parameter

      .pipe(replace(/webpackJsonp/g, 'webpackJsonLvsp'))

      .pipe(gulp.dest(putBackPath))

  }

  done()

  console.log('打包完成')

})

參考資料:

https://github.com/lazd/gulp-replace

https://cloud.tencent.com/developer/article/1383945

https://blog.csdn.net/hsl0530hsl/article/details/78363222

http://www.ruanyifeng.com/blog/2016/10/npm_scripts.html

繼續閱讀