Правильно ли я понимаю как работает webpack и NPM?

Question

[beduin01]

Правильно ли я понимаю, что webpack это штука позволяющая компоновать все зависимости в один файл. И что его можно использовать только вместе с NodeJS.

Ситуация такая, что регулярно встречаю упоминания, что нужно пользоваться менеджерами пакетов типа npm -- почитал. Он идет в составе NodeJS. Но я не планирую писать серверную часть на JS.

Как быть? Разве руками сложно пару либ в проект подключить - я же не думаю, что в проектах используется по 20-30 зависимостей.

Ну и допустим что будет, если мы все эти 30 зависимостей в один файл запакуем -- файл же станет весить крайне много.

Правильно ли я понимаю, что я не смогу использовать `require` если не работаю с NodeJS?

Answer 1

[vsuhachev]

webpack позволяет делать препроцессинг js и других зависимостей, таких как стили, графика и т.п. Во сколько файлов компоновать - настраивается под конкретные нужды проекта.

Сам webpack работает на ноде, но его работа нужна только в режиме разработки. Результаты сборки в nodejs не нуждаются, вы получаете собранные файлы (js, css, html, ...) которые будете отдавать статикой.

Делать сборку руками однозначно моветон. Хотя, конечно вы все можете сделать руками, даже экзешник в hex-редакторе набрать, но так уже давно никто не делает :)

Запаковка всех зависимостей в один файл - оптимизация времени загрузки, экономится время на соединение с сервером, а передаваемый объем даже уменьшится т.к. большой файл в gzip-нутом виде занимает меньше чем 20-30 частей его составляющих сжатых по отдельности.

require вы сможете использовать если будете использовать webpack. Если без него, то смотрите common.js

Answer 2

[r1ch]

Я использую requirejs, который подтягивает все js, html(text - плагин для шаблонов) файлы по ajax и кэширует их. Есть еще requirejs optimizer, который умеет минифицировать, склеивать в один файл все файлы зависимостей.

Минус работа с css не очень понятная и придется вынести это в gulp.

Пример: https://github.com/rishatsharafiev/crm/tree/api/pr...

Comments

[beduin01]

Тоесть я могу указать каталог где лежат все JS, а не прописывать их руками каждый раз? Если так, то они будут выполняться, когда все загрузятся полностью?

[r1ch]

beduin01: каждый файл является модулем. В конфиге проекта прописываются названия используемых либ и пути до них, потом в своих модулях прописываешь названия либ и они подключаются непосредственно перед исполнением кода в твоем модуле. Также модули можно использовать в других модулях. Все это позволяет структурировать код проекта, например, в backbone есть модели, представления, коллекции, роутеры, их можно распихать по отдельным модулям и переиспользовать в других модулях.