Skip to content

Instantly share code, notes, and snippets.

@sayore
Created September 2, 2017 20:51
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save sayore/d6efeee3c8cd3bc3a2284e661927234b to your computer and use it in GitHub Desktop.
Save sayore/d6efeee3c8cd3bc3a2284e661927234b to your computer and use it in GitHub Desktop.
gulpfile.js
const gulp = require('gulp');
const imagemin = require('gulp-imagemin');
const uglify = require('gulp-uglify');
const sass = require('gulp-sass');
const concat = require('gulp-concat');
const browserSync = require('browser-sync').create();
gulp.task('message', () => {
return console.log("Hello World!");
})
gulp.task('default', ['html', 'css', 'js', 'sass', 'images']);
gulp.task('watch', () => {
browserSync.init({
server:"./dist/",
baseDir:"./dist",
files:"./dist/*",
injectChanges:true
});
gulp.watch('src/**/*.html', ['html']).on('change', browserSync.reload);
gulp.watch('src/css/*.css', ['css']).on('change', browserSync.stream);
gulp.watch('src/js/*.js', ['js']).on('change', browserSync.reload);
gulp.watch('src/sass/*.sass', ['sass']).on('change', browserSync.stream);
gulp.watch('src/images/*', ['images']).on('change', browserSync.reload);
})
gulp.task('html', () => {
return gulp.src("src/*.html")
.pipe(gulp.dest('dist'));
})
gulp.task('css', () => {
return gulp.src("src/css/*.css")
.pipe(gulp.dest('dist/css'))
.pipe(browserSync.reload({stream:true}));
})
gulp.task('js', () => {
return gulp.src("src/js/*.js")
.pipe(concat('main.js'))
.pipe(uglify())
.pipe(gulp.dest('dist/js'))
.pipe(browserSync.stream());
})
gulp.task('sass', () => {
return gulp.src("src/sass/*.scss")
.pipe(sass({
outputStyle: 'compressed'
}).on('error', sass.logError))
.pipe(gulp.dest('dist/css'))
.pipe(browserSync.stream({stream:true}));
})
gulp.task('images', () => {
return gulp.src("src/images/*")
.pipe(imagemin())
.pipe(gulp.dest('dist/images'));
})
<!DOCTYPE html>
<head>
<link href="./css/style.css" rel="stylesheet">
</head>
<body>
<img id="background" />
<div class="main">
<div class="banner">
<img style="height: 100%;width: 100%;" src="./images/logo1.svg" />
</div>
<div class="links">
<a>
<div class="button_sel">Hauptseite</div>
</a>
<a>
<div class="button">Projekte</div>
</a>
<a>
<div class="button">Über MichH</div>
</a>
<a>
<div class="button">Hauptseite2</div>
</a>
<a>
<div class="button">Hauptseite</div>
</a>
</div>
<div class="contentA">
<h1>Content</h1>
<p>Ich bin ein Designerr, Programmierer und Fan von neuen Technologien.</p>
</div>
<div class="contentB">
</div>
<div class="contentC">
</div>
<div class="contentD">
</div>
<div class="bottom">
<div style="margin:15px;">&copy; Benjamin Krippner 2017</div>
</div>
<div class="social">
<img class="social_icon" src="./images/youtube.png" />
<img class="social_icon" src="./images/facebook.svg" />
<img class="social_icon" src="./images/twitter.svg" />
</div>
</div>
</body>
</html>
@sayore
Copy link
Author

sayore commented Sep 2, 2017

Deu: Die Schreibfehler waren zum testen da falls hier jemand Deutsch ist.
Eng: (The spelling errors were for testing(just if germans are present))

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment