logo
down
shadow

Using Gulp and Gulp Replace Name to clone a project but rename files that contain a certain word inside multiple folders


Using Gulp and Gulp Replace Name to clone a project but rename files that contain a certain word inside multiple folders

By : Xinkun Li
Date : November 20 2020, 11:01 PM
I wish this help you It's a bug in gulp-replace-name. When it encounters a directory it tries to call a callback cb that doesn't exist, which leads to the error you receive. It also doesn't even attempt to rename directories, which you need.
I suggest you use the gulp-rename plugin instead. It's thoroughly tested and has had a large user base for years, so you're unlikely to run into problems like this.
code :
var gulp = require('gulp');
var rename = require("gulp-rename");

gulp.task("duplicate", function () {
  return gulp
    .src("./originalProject/**/*")
    .pipe(rename(function(file) {
      file.dirname = file.dirname.replace(/originalProject/g, "cloneProject");
      file.basename = file.basename.replace(/originalProject/g, "cloneProject");
    }))
    .pipe(gulp.dest("./cloneProject"));
});

gulp.task("default", ["duplicate"]);


Share : facebook icon twitter icon
Replace files in sub folders with gulp / imagemin

Replace files in sub folders with gulp / imagemin


By : RayC
Date : March 29 2020, 07:55 AM
Using gulp and gulp-rename to output multiple stylus theme files

Using gulp and gulp-rename to output multiple stylus theme files


By : user2955265
Date : November 22 2020, 10:38 AM
this one helps. I'm trying to set up a theme system for my project, what I have currently takes a theme file in stylus like theme\default.theme.styl that only includes variables storing colors and applies it to whatever other component style files we have included (e.g. button.styl). The idea is that I can have more than one theme file, say blue.theme.styl and red.theme.styl and gulp will output two separate css files based on the component styling. So I'd get button.blue.styl and button.red.styl as two separate files. , Turns out it works to just return an array of streams:
code :
TaskManager.createTask
  name: 'css'
  description: 'Build the component CSS files'
  options: buildOptions.concat
    name: 'theme'
    type: 'Array'
    description: 'themes to compile'
    default: 'default'
    supported: ['default', 'blue', 'red']
  hide: true
  fn: ->
    themes = TaskManager.getArg('theme')
    DEST = 'dest/components'
    nib = require 'nib'

    stream = []

    createTask = (themeName) ->
      return gulp.src ["src/**/*.styl", "!src/theme/*", "!src/global/*"]
        .pipe(plugins.plumber(errorHandler: TaskManager.error))
        .pipe(plugins.stylus
          use: [
            nib()
          ]
          include: [
            'src/util'
            'src/global'
            'src/theme'
          ]
          import: "#{themeName}.theme"
        )
        .pipe(rename (path) ->
          path.extname = ".#{themeName}.css"
          undefined
        )
        .pipe(plugins.filelog 'css')
        .pipe(gulp.dest 'dest')

    themes.map (name) ->
      task = createTask name
      stream.push task

    return stream
Gulp loosing relative path for files from gulp.src(Array) to gulp.dest

Gulp loosing relative path for files from gulp.src(Array) to gulp.dest


By : Hobby
Date : March 29 2020, 07:55 AM
hope this fix your issue I figured out how to use base to fix my Issue.
It's simple, just add a base with a __dirname, like so. Just make sure you set inside path.resolve():
code :
gulp.task('copyHTML', function() {
    return gulp.src([
        '../Source/ComponentA/**/*.html',
        '../Source/ComponentC/**/*.html'
    ],
    {base: path.resolve(__dirname + '/../Source')})
    .pipe(gulp.dest('public_html'));
});
gulp rename multiple files

gulp rename multiple files


By : BOVIS
Date : March 29 2020, 07:55 AM
Hope this helps Don't make functions within a loop.
Your loop creates multiple functions that you pass to rename. Each of those functions refers to the same variable name. However those functions aren't executed immediately, but only after all of them have been created. That means all your functions refer to the last value that name had in the loop.
code :
var gulp = require('gulp');
var rename = require('gulp-rename');
var merge = require('merge-stream');

gulp.task('default', function () {
  var data = ['name1','name2'];
  var streams = [];
  data.forEach(function(name) {
    var stream = gulp.src('src/master.html')
      .pipe(rename(function(path) {
        path.basename = name;
        path.extname = '.html';
      }))
      .pipe(gulp.dest('dist'));
    streams.push(stream);
  });
  return merge(streams);
});
gulp: set multiple gulp.src and respective gulp.dest (on gulp-sass example)

gulp: set multiple gulp.src and respective gulp.dest (on gulp-sass example)


By : Håñäd Ýàre Mäýkäl Mö
Date : March 29 2020, 07:55 AM
around this issue See my answer to a similar question: Gulp.dest for compiled sass. You should be able to modify that easily for your purposes. If you have trouble edit your question with your code and you will get help.
code :
var gulp = require("gulp");
var rename = require("gulp-rename");
var path = require("path");
var sass = require("gulp-sass");

gulp.task('modules-sass', function () {

      // using .scss extensions for sass files

  return gulp.src(`development/**/*.scss`)

    .pipe(sass())

    .pipe(rename(function (file) {

        // file.dirname before any changes
        console.log("file.dirname  1 = " + file.dirname);

        // this removes the last directory
        var temp = path.dirname(file.dirname);
        console.log("    temp = " + temp);

        // now add 'Css' to the end of the directory path

        file.dirname = path.join(temp, 'Css');
        console.log("    after = " + file.dirname);
    }))

    .pipe(gulp.dest('development'));
});

           // this is the directory structure I assumed
           // gulpfile.js is just above the 'development' directory

// development / Admin / Sass1 / file1.scss
// development / Admin / Sass1 / file2.scss

// development / Admin / Sass2 / file3.scss
// development / Admin / Sass2 / file4.scss

// development / Admin / Css

// development / Public / Sass1 / file5.scss
// development / Public / Sass1 / file6.scss

// development / Public / Sass2 / file7.scss
// development / Public / Sass1 / file8.scss

 // development / Public / Css
Related Posts Related Posts :
  • How to get my thumbnails to display in random positions (in archive page wordpress)
  • $scope methods not recognized from table AngularJS
  • Cx framework: How to access a DOM element in Cx?
  • $mdDialog could not load template with ngtemplates
  • How to fix this blank list appearing in materializecss autocomplete?(Internet Explorer)
  • Javascript : Show value behind
  • Switching from an open Bootstrap 3 dropdown menu to a different dropdown menu requires an extra tap on mobile
  • creating a circle with webgl with mouse clicks
  • firebase.database.ServerValue.TIMESTAMP return an Object
  • Matching varients and mis-spellings of a word using RegEx in MS Word
  • JS: Can a recursive function be decorated with cache?
  • How to compare pixels in Three.js
  • Non-jQuery: Getting height even if the max-height is zero
  • check count datatable is empty or not
  • Angularjs search product by price (from price to price)
  • Can't change colour of text with CSS in a table
  • Get Php variable in to Javascript function
  • fabricjs IText: overlapping character background-color making lines when semitransparent
  • Check if text is selected on keydown event
  • Angular Js ng-repeat iterating over JSON
  • Issue with socket.io updating component to show new message in chatroom
  • Vue.js: Cannot trigger ready of a component when only a param of route change
  • How do I get JSON result from controller to JavaScript
  • How to get data-src attribute with jquery?
  • JavaScript - concat two numbers and treat the result as a number
  • resizable attribute of jquery is not working
  • select random value based on condition in Jquery
  • Print another HTML page using javascript:window.print
  • Method being called before Promise is complete
  • Integrating a loader with d3.js
  • Uncaught SyntaxError: Unexpected token in Ionic
  • Executing a JavaScript file in HTML code
  • creating your own div
  • Need JS help- collapsing a toggled down element when another is selected
  • Fix the headers in html table populated by ajax
  • How to pass the value of text box and compare it to the variable.. Javascript
  • forEach works on querySelectorAll, but not getElementsByTagName?
  • why does google maps code wrapped in a div not work?
  • How to assign variable for jquery ajax post method
  • Why can't I break out of this for loop?
  • Can't add data to table with plain JS
  • How to read array object in angularjs
  • How to apply class dynamically while doing custom pagination?
  • How to get new line in node JS and passing it as JSON and saving it in a text File
  • ionic.bundle.js:25642 Error: [ngRepeat:iexp] Expected expression in form of '_item_ in _collection_[ track by _id_]' but
  • Dynamically call function in javascript
  • unknown database while running servlet code
  • JQuery hashchange event - where to place?
  • reactjs image slider navigation function, cant seem to get it working properly
  • Javascript normal Array value and Array value created by match function comparison
  • pass a value from javascript to html and codeigniter
  • how to perform div hover shows another div but both div's are different form?
  • Draw a buffer with subbuffers webgl
  • Call a function on click event in Angular 2
  • Object.assign getters and setters in constructor
  • Have to set Number of Threads, Ramp up Period and Loop count from an external properties file
  • Post data from javascript to php file using ajax doesn't work
  • How to access method in prototypal inheritance pattern?
  • Q: How do I make each div fade away individually?
  • JavaScript/jQuery: how to get HTML and display HTML, including tags
  • shadow
    Privacy Policy - Terms - Contact Us © soohba.com