• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Pierwszy task HTML

0 głosów
185 wizyt
pytanie zadane 13 czerwca 2017 w HTML i CSS przez kralcz88 Obywatel (1,730 p.)
Witam!

W ramach zmierzenia się z typowym taskiem chciałbym wykonać projekt według projektu. Wytyczne zakładają użycie Bootstrapa w wersji sass oraz wtyczek kompilacji, minifikacji oraz dodawania autoprefixów.

Na początek czy dobrych wtyczek chce użyć?

autoprefixy - https://www.npmjs.com/package/grunt-autoprefixer

Nie wiem za bardzo co to jest ta minifikacja oraz nie jestem pewny jakiej wtyczki powinien użyć, żeby kompilować SCSS do CSS.

Czy może ktoś wesprzeć mnie?

2 odpowiedzi

–1 głos
odpowiedź 13 czerwca 2017 przez kralcz88 Obywatel (1,730 p.)
wybrane 13 czerwca 2017 przez kralcz88
 
Najlepsza
Dzięki za odpowiedź!

Do tej pory nigdy nie korzystałem z Gulpa, ale mam na komputerze środowisko node js i grunta.

Czy muszę dodatkowo instalować Gulpa czy od razu instaluje pluginy?
komentarz 13 czerwca 2017 przez zgrybus Pasjonat (24,940 p.)
Musisz
komentarz 13 czerwca 2017 przez kralcz88 Obywatel (1,730 p.)

Czyli w konsoli wystarczy wpisać

npm install --global gulp-cli

 

i to tyle? Potem Tworzę gulpfile.js i tyle?

komentarz 13 czerwca 2017 przez zgrybus Pasjonat (24,940 p.)
komentarz 13 czerwca 2017 przez kralcz88 Obywatel (1,730 p.)
Dzięki :)
komentarz 13 czerwca 2017 przez zgrybus Pasjonat (24,940 p.)
mozesz wrzucic najlepsza :D
komentarz 13 czerwca 2017 przez kralcz88 Obywatel (1,730 p.)
Powiedzcie proszę o co chodzi z zastosowaniem w projekcie Bootstrap Sass version.

1. Jak z tego z tego skorzystać? Wystarczy, że pobiorę pliki i dołączę do projektu?

2. Jak jest różnica pomiędzy zwykłym Bootstrapem, Bootstrap w wersji Sass?

3. Gdy mam w projekcie Gulpa to czy trzeba jakoś dodatkowo dodać Bootstrap Sass do niego?
komentarz 14 czerwca 2017 przez zgrybus Pasjonat (24,940 p.)

przecież gulp Ci to zmieli do jednego pliku css..
Masz wszystko dokładnie napisane w tym tasku, czytałeś?

return gulp.src('./sass/**/*.scss')

Z daleka widać przecież co robi ta linijka.

komentarz 14 czerwca 2017 przez kralcz88 Obywatel (1,730 p.)
Gulp działa OK, komplikuje do Sass do CSS bez problemów.

Ja pytam o wykorzystanie w frojekcie Bootstrap Sass version. Nidy z tego nie korzystałem i nie wiem jak ugryźć temat. Do tej pory korzystałem z Bootstrapa podpisanego z CDN. A Bootstrap Sass versionwymaga ściągnięcia plików i pytanie co mam z nimi dalej zrobić
komentarz 14 czerwca 2017 przez zgrybus Pasjonat (24,940 p.)
no nic, po prostu daj je tam gdzie masz pliki sassa
komentarz 16 czerwca 2017 przez kralcz88 Obywatel (1,730 p.)

Czy mółgby ktoś rzucić okiem na konfigurację gulpfile poniżej? Coś chyba jest nie tak z minify-css i autorpofixami, bo watch nie śledzi zmian w tym wypadku. 
 

var gulp = require('gulp');
var sass = require('gulp-sass');
var cleanCSS = require('gulp-clean-css');
var autoprefixer = require('gulp-autoprefixer');


gulp.task('sass', function(){
	return gulp.src('app/scss/**/*.scss')
	.pipe(sass())
	.pipe(gulp.dest('app/css'))
});

gulp.task('watch', function(){
	gulp.watch('app/scss/**/*.scss', ['sass', 'minify-css', 'default']);
});

gulp.task('minify-css', function(){
	return gulp.src('app/css/*.css')
	.pipe(cleanCSS({compatibility: 'ie8'}))
	.pipe(gulp.dest('app/css'))
});

gulp.task('default', function(){
	gulp.src('app/css/*.css')
	.pipe(autoprefixer())
	.pipe(gulp.dest('app/css'))
});

 

0 głosów
odpowiedź 13 czerwca 2017 przez zgrybus Pasjonat (24,940 p.)
Potrzebujesz Gulpa / Grunta  - polecam Gulpa :)

Gulp - https://www.npmjs.com/package/gulp

Sass -> Css - https://www.npmjs.com/package/gulp-sass

Minify - https://github.com/scniro/gulp-clean-css  // w sass -> css ( wystarczy dodać parametr compressed i wtedy nie potrzebujesz tego ).

Autoprefixer - https://www.npmjs.com/package/gulp-autoprefixer

Podobne pytania

–1 głos
1 odpowiedź 62 wizyt
pytanie zadane 5 stycznia w HTML i CSS przez pomaraqcz Początkujący (380 p.)
0 głosów
0 odpowiedzi 89 wizyt
pytanie zadane 16 sierpnia 2017 w HTML i CSS przez Patrick Nowicjusz (120 p.)
+1 głos
2 odpowiedzi 78 wizyt
pytanie zadane 17 czerwca 2017 w HTML i CSS przez kralcz88 Obywatel (1,730 p.)
Porady nie od parady
Zadając pytanie postaraj się o poprawną pisownię i czytelne formatowanie tekstu.Kompozycja

65,755 zapytań

112,393 odpowiedzi

237,319 komentarzy

46,700 pasjonatów

Przeglądających: 143
Pasjonatów: 0 Gości: 143

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...