Push changes to server with Git, but with whole assets?

[Giltvedt]

I'm not quite sure I do it right with Git when I update the latest changes to the server. Website with brand new site from first push don't have stylesheets with custom styles.

When running npm run watch and npm run build to build latest changes, but gets the same result.

Uses Git to push changes to the server, but not all the assets are synchronized. When I look in .gitignore I see that some folders in assets will not be included in the update.

I understand why it is not included in git, but what do I do to get changes on the server from the same Git?

So I use Git incorrectly?

PS: My English is not quite good, but hope the text is understandable. Mixes a little with own text and some of Google Translate.

[olefredrik]

Hi @Giltvedt . Greetings from Stavanger :)

You could modify the existing package task in Gulpfile.js to output a dist folder instead of a .zip file.

In your Gulpfile.js, change lines 179-188 to something like this

// Package task
gulp.task('package', ['build'], function() {
  var fs = require('fs');
  var time = dateFormat(new Date(), "yyyy-mm-dd_HH-MM");
  var pkg = JSON.parse(fs.readFileSync('./package.json'));
  var title = pkg.name + '_' + time + '.zip';

  return gulp.src(PATHS.pkg)
    .pipe(gulp.dest('dist'));
});

save and run npm run package

That will create a /dist folder in your repository with all the files you need for production. If you can modify your deployment routines to pick up the /dist folder instead of the root of your repository, I think you should be good to go.

PS! A small fix was applied to package.json file regarding the package script yesterday. Make sure you apply this before running npm run package.

Let me know how it goes!

[Giltvedt]

Hi @olefredrik. Thank you for quick reply! Greetings from Oslo :D

Actually this work very well! Thank you. This is first time I'm using Gulp and it's great! I'm looking forward to modify more of Gulp settings/task, but it do already more than I need, I think!

Everything is ready in /dist folder and the next step is to modify the deployment routines.

I am not advanced user of Git, yet. So any hint how I can modify deployment routines like that you told?

[olefredrik]

Actually I'm not very experienced in automatic git deployment routines myself. There are a bunch of tools that can do the heavy lifting for you, though. https://github.com/integrations/feature/ship

I plan to set up automatic deployment from Github myself. Now I'm using a rsync (ssh) deploy script via the terminal. Would be more sweet if this was automated.

[Giltvedt]

I see. My workflow is SourceTree and push to server with SSH when I'm happy with latest changes.

Anyway thank you for quick answer and tip! 👍

I will look into this and figure how I can modify my local repo for deployment. Any tips/howto/explain from others is welcome :)

[Giltvedt]

Just noticed something when I ran another npm run package after first time.

When /dist folder already exist in root folder then /dist folder also generated again inside /dist too. If I run npm run package again will it create another /dist folder. It's not on purpose?

In my gulpfile.js:

// Package task
gulp.task('package', ['build'], function() {
  var fs = require('fs');
  var time = dateFormat(new Date(), "yyyy-mm-dd_HH-MM");
  var pkg = JSON.parse(fs.readFileSync('./package.json'));
  var title = pkg.name + '_' + time + '.zip';

  return gulp.src(PATHS.pkg)
    // Yay! Got a little help here -> https://github.com/olefredrik/FoundationPress/issues/700
    //.pipe($.zip(title))
    //.pipe(gulp.dest('packaged'));
    .pipe(gulp.dest('dist'));
});

[olefredrik]

Nevermind what I said earlier about modifying the npm run package task. The best way to bundle assets for production is to use npm run production task. This will minify all your scripts and styles in your current theme folder.