С webpackom если разберетесь, то он сможет вам делить ваши бандлы как угодно. универсальный комбайн. Особенно в связке с гальпом (в связке рекомендую использовать обёртку piped-webpack вместо webpack-stream, она корректно работает с DLL).
yarn vs npm — это исключительно дело вкуса. Никаких преимуществ. Сначала они делали упор на скорость и на более "понятные" команды. Но в свете выхода последних версий npm первое неактуально, а второе изначально было вкусовщиной.
Сергей, а вот у бовера было удобно,что именно библеотеки устанавливал в другую папку,и не приходилось кавыряться в куче файлов в ноде_модульс чтобы найти нужную папку и подключаешь быстро :)
Либо webpack с плагином ExtractTextPlugin import 'slick-carousel/slick/slick.css';
В обоих случаях нужно лезть в папку модуля и смотреть как у него лежат файлы (либо смотреть документацию, но там не всегда есть нужная инфа, либо просто знать =) )
С другой стороны подключение библиотеки происходит только один раз. А для следующих проектов можно из старых копирнуть строчки, или по памяти написать.
Сергей delphinpro, привет, тоже недавно начал разбираться в инструментарии и наткнулся на данное обсуждение. Вот автор пишет:
Все уже используют Yarn вместо Npm, Webpack вместо Gulp
Возможно, я сам запутался в этом многообразии, но вроде Webpack и Gulp - это разные вещи. Или я ошибаюсь?
И в решении человек пишет..
npm - когда для сборки достаточно нескольких команд (через cli прописывается в "scripts":{})
Но как я понял, npm - просто пакеты устанавливает, те же Webpack и Gulp ... он ничего не собирает, или это тоже не верно? Очень размытое представление пока об этих инструментах. Помогите разобраться, что для чего? )
Senseich,
Yarn используют далеко не все.
Webpack и Gulp - это разные вещи.
npm не только ставит пакеты. Есть команда npm run, она запускает скрипты, которые вы описываете в секции scripts файла package.json.
Таким образом для сборки проекта действительно необходимо выполнить пару команд
npm install чтобы все установить
npm run build чтобы собрать
Сергей delphinpro, т.е. можно обойтись одним npm? а остальное тогда зачем, дополнительное упрощение? Как я понял Webpack и Gulp всё равно используют пакеты npm.
npm - когда для сборки достаточно нескольких команд (через cli прописывается в "scripts":{}) webpack - для сборки средних и больших приложений (HMR, live reload и т.д. очень удобны) gulp - более универсален, так как это не просто сборщик, а таск раннер, но в то же время написанные таски могут быть не такими удобными в чтении и сопровождении, как конфиги в webpack'е
есть еще rollup - почти то же, что и webpack, только поскромнее и используется обычно для сборки библиотек, где кроме js особо ничего нету
И что касается конкретно вашего вопроса, то наверное webpack подойдет
О том что фронтэнд как специализация усложняется день ото дня не в силу каких-то новых крутых технологий, призванных сделать работу фронта легче, а web удобнее и быстрее, а потому что растет количество инструментов предназначенных для упрощения жизни разработчика, а по факту вносят хаос.
О том что человек, задавший вопрос умеет во фронтэнд (вроде как), но в силу возникшего хаоса слабо представляет какие инструменты использовать не задумываясь: а может вообще не использовать? Ну там… писать минимальный код, разделять стили/скрипты по страницам без кучи вспомогательных инструментов, svg-спрайт минифицировать и собрать. Ручками. По-старинке. По файликам раскидывать код, понимать как это будет работать и что где у него?
Вам не кажется что существование такой проблемы как «Какой отверткой вкрутить шуруп в 2017» это какой-то бред? У человека начались проблемы когда ему понадобилось вкрутить шуруп не в табурет, а в стол! И всё: паника, неразбериха, непонимание…
Я не адепт-старовер и не свидетель Nootpad'а, но мое сугубо личное — рановато вставать на гироскутер, если еще ходить не научился.
В чем-то я с вами согласен. Реально хаос вокруг. Столько разных инструментов и не понятно, облегчают они работу или наоборот, только усложняют.
Но например некоторые фичи, все же очень полезны. Тот же autoprefixer. Зачем каждый раз прописывать префиксы вручную, когда за тебя это может сделать gulp-autoprefixer.
И таких мелочей очень много.
Но в целом, да, постоянные новинки, просто жесть какая-то.
Вот только вроде разобрался с gulp, с установкой, настройкой, внедрил это все в работу, полез в интернет за информацией, а это уже устарело. Нужно осваивать, что-то новое.
Блин, да когда же это все закончится, когда уже будет несколько единых стандартов и всем станет легче.
Геннадий Караченцев, Gulp-prefixer - поддерживаю. Плюс всякие компиляторы и uglyifer'ы для скриптов, компиляторы для препроцессоров, сборщики сторонних плагиновских стилей, live-reload... На мой взгляд - уйма полезностей в одном флаконе, если правильно настроить. Я теперь на лендингах бед не знаю.
В любой IDE или нормальном редакторе кода, есть модули и плагины такие как автопрефиксер и т.д.. нажал комбинацию клавиш и все префиксы сами стали, ни галпов ни онлайн генераторов не нужно... Лайф релоадер точно так же ставишь в брайзер плагин и у тебя все релоадиться, так же есть такие вещи как снипеты с вашими заготовками и т.п... В общем вроде как галп и вебпак в чем-то полезны, но далеко не везде и не всегда.
Yarn и npm - одно и тоже.
Gulp и webpack - это таск раннер и бандлер, что нужно под конкретный проект то и используйте.
ES6 не может быть вместо ES5, это ES5 + грубо говоря синтаскический сахар. Если вам комфортно использовать es6 используйте его, чтобы писать код быстрее и красивее, если нет пишите на ваниле.
Геннадий Караченцев, бауэр он не может заменить, так как бауэр это не то совсем. Галп/грант да, может. Но конфигурировать сложнее, и на каком-нибудь проекте где вам нужно поверстать лендосик незачем поднимать вебпак, можно за 5 минут галпконфиг написать на пайпах и не париться.
Иван, если пишу новый проект или в существующем есть yarn.lock - использую yarn, иначе npm, экспириенc перестал отличаться с выходом npm 5, до этого npm хуже хранил версии зависимостей и ощутимо дольше устанавливал пакеты
ES6 это не что-то другое и модное, это javascript. Желательно знать. Yarn вместо npm - ничего особого опять же, он делает все то же самое, названия команд немного отличаются, и то с новой версией npm вроде в нем и нет смысла уже. Раньше смысл был в скорости и еще вроде в том, что yarn автоматически добавляет установленный пакет в зависимости. Теперь это npm тоже делает. В любом случае, если знакомы с npm, то yarn это 5-10 минут чтобы разобраться.
Остается только webpack, но если нет желания совсем в нем разбираться, можно найти starter kit на гитхабе.
В итоге, ничего тут страшного нигде нет. А что-то новое постоянно будет, особенно, если долго не следить за тенденциями.
npm5 обновился но yarn все еще немного быстрее https://youtu.be/Pq05bTlTDPM
сейчас все используют webpack это факт
есть люди которые используют gulp для css и для оптимизация проекта
Простой
