artfable Feb 2 2019 at 19:28

Frontend для backend девелопера

5 min

13K

Programming *Gradle *

From sandbox

+21

Comments 15

pesh1983 Feb 2 2019 at 23:01

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

Ну как минимум с gradle и kotlin/groovy разобраться придется. Бэк не джавой единой живёт, не все бэк разработчики пишут на ней и не все бэки реализованы на джаве. Я бы озаглавил статью вроде "Frontend для Java Backend девелопера", так будет честнее что-ли)

artfable Feb 3 2019 at 00:51

В целом согласен, но вы делать именно Java не хотелось бы. Gradle, например, также используют кто под Unity пишет, может еще кто.

-1

TimsTims Feb 3 2019 at 16:12

Unity же не относится к бэкенду. Путаницы не будет.

Serge78rus Feb 2 2019 at 23:38

В совсем древние времена из-за почти полного отсутствия каких-либо вменяемых инструментов, я для сборки фронтенда использовал даже Ant. Сейчас о нем, наверное, уже мало кто даже из Java разработчиков помнит. Но все же лучше использовать вещи по своему прямому назначению, даже несмотря на текущую неразбериху с инструментами для фронтенда.

justboris Feb 3 2019 at 02:18

Какие у вас планы на поддержку и развитие проекта? До полноценной замены npm ему еще очень далеко:

Логика работы с транзитивными зависимостями не реализована. Npm умеет обрабатывать ситуации, когда модули зависят от одного пакета, но разных версий. У вас сейчас модули складываются в плоский список, но иногда они могут быть и деревом.
В import-fix плагине код обрабатывается регулярками. Это очень ненадежно, и может сломаться, например, если где то будет import c двойными кавычками: import "@polymer/polymer". Для надежной работы нужен парсер и работа с AST.
Ну и для продакшена скрипты лучше все-таки помодульно не грузить, а склеить в пачку, чтобы пользователям трафик экономить. Какие у вас есть решения для этой ситуации?

Gugic Feb 3 2019 at 02:41

Помимо склейки есть еще минификация и оптимизация при компиляции (см. например closure compiler), что также весьма полезно.

artfable Feb 3 2019 at 16:25

Загрузка транзитивных зависимостей есть. Что касается ситуаций зависимостями от одного модуля: плагин ищет саму последнюю версию которая будет удовлетворять все пакеты что требуют. Если же такое невозможно и происходит коныликт, то есть возможность указать excludes и обозначить версию, которы вы хотите видеть. (в README к плагину все описанно).

Учитывая HTML/2 и кеширование — как раз лучше для прода грузить помодульно. Но если хочется все равно склеить — можно добавить какой-нибудь плагин, например есть плагин для google closure compiler, которые еще и минификацию может сделать.

justboris Feb 3 2019 at 17:28

Учитывая HTML/2 и кеширование — как раз лучше для прода грузить помодульно

Несмотря на кучу презентаций, для своих собственных сайтов Google ресурсы все-таки бандлит. Кроме того, есть вот такое мнение. Еще вот здесь есть объяснение от разработчика Nginx, что не так с HTTP/2. Так что, склейка ресурсов все еще нужна.

Closure compiler занимается минификацией отдельных файлов. Перед этим нужно еще разрезолвить импорты и собрать их всех вместе. Что для этого посоветуете?

artfable Feb 3 2019 at 17:53

Вот например плагин который использует closure compiler, умеет собирать все импорты вместе и еще много чего.

justboris Feb 3 2019 at 18:18

Насколько я вижу из реализации combineJs task, она просто позволяет найти и склеить все файлы по списку. А как сделать так, чтобы я указал входной файл src/index.js, а система сборки сама проанализировала импорты и добавила @polymer/polymer и @polymer/app-layout, которые я использую, например?

artfable Feb 3 2019 at 18:35

Ну тут несколько вариантов: можно например дописать и сделать пул реквест, можно найти что-либо другое, ну и на крайний случай, взять npm плагин — если это кажется действительно проще.

У меня не было цели найти silver bullet, которая бы закрыла потребности абсолютно всех. Цель была показать идею, в каком направление смотреть. И разобрал я те случаи, которые считаю наиболее необходимыми, а как уже заметил выше — сборка в один, таковой для меня не является.

justboris Feb 3 2019 at 19:17

Понятно, то есть этот плагин для случая «хочу взять пару скриптов и npm и все».

Для написания более-менее толстых SPA все-таки добро пожаловать в мир gradle-node-plugin.

Интересно, а насколько большой (по числу строк Javascript) у ваc проект с использованием polymer и gradle-npm-repository-plugin?

-1

RiseOfCat Feb 3 2019 at 16:05

Сделал pull request в твой репозиторий:
github.com/artfable/frontend-demo/pull/1

Но почему то у меня не получается запустить проект.
Браузер ругается:
Failed to resolve module specifier "@polymer/polymer/polymer-legacy.js". Relative references must start with either "/", "./", or "../".

artfable Feb 3 2019 at 16:08

Вы добавили runLocalServer таск, который берет src директорию, а не то что в build. js-import-fix плагин нацелен же на build — соответственно пути и не исправленны. С отсутствием libs директории вчера уже поправил.

RiseOfCat Feb 3 2019 at 17:50

Спасибо!