Javascript-форум (https://javascript.ru/forum/)
-   Сборка проекта, утилиты (https://javascript.ru/forum/server-tools/)
-   -   Сборщик со включением по комментариям (https://javascript.ru/forum/server-tools/61741-sborshhik-so-vklyucheniem-po-kommentariyam.html)

Romaboy 06.03.2016 12:22

Сборщик со включением по комментариям
 
Сборщиков существует не мало, и все они работают аналогично. Я попробовал grunt и gulp, и единственная существенная разница, по-моему, что gulp работает быстрее раза в 4, а возможности одинаковые. По этому выбрал gulp и долго и муторно писал на нем систему, которая по комментариям в файлах может подключать файлы. Имею в виду:
//= require file
//= require_dir ./directory_with_js
//= require_tree ./dir_recursive

И получилось очень даже неплохо, но от самих функций gulp при этом ничего не осталось. Возможно где-то кое-как подглючивает. Подскажите, может есть система сборки которая это умеет, а то думаю переписать, но если уже существует то велосипед делать не хочется.

Erolast 07.03.2016 08:55

Цитата:

Подскажите, может есть система сборки которая это умеет, а то думаю переписать, но если уже существует то велосипед делать не хочется.
Ответить с цитированием
Лол, вопросом "а может, есть уже готовое" надо задаваться всегда, когда собираешься что-то делать. А никак не после.

WebPack, у Ильи здесь есть скринкаст по нему.
Ну или хотя бы Browserify, он попроще, хоть и менее гибок.

Заодно, если уж все равно реализуешь этап сборки, советую подключить Babel и писать на нормальном ES6.

Romaboy 07.03.2016 18:35

Вопрос был какой сборщик умеет файлы по комментариям в них собирать. Чтобы это узнать надо скринкасты пересмотреть? А вдруг webpack не умеет, тогда зря посмотрю? Гугл мне ответить не смог, все таки допишу свой сборщик, как бы пафосно не звучало - всего несколько часов займет. А es6 с babel это очень модно и здорово, так что мою карму ещё заминусят, когда скажу, что на coffeescript все равно писать быстрее и удобней.

Deff 08.03.2016 00:48

Romaboy,
В принципе в специально построенной функции можно выпарсить всё что угодно, в том числе и комментарии:

function collector (){ /*==123==;

//= require file
//= require_dir ./directory_with_js
//= require_tree ./dir_recursive

==123==;*/
} collector = collector.toString().split('==123==;')[1]
arrCollect = [];
collector.replace(/\/\/=(.+?)\s*\n/g,function (s,p1){arrCollect.push(p1); return s});

alert(arrCollect.join(',\n'))


Типично удобно делать тоже самое из элемента <noscript>

<noscript id="collector"><!--
require file
require_dir ./directory_with_js
require_tree ./dir_recursive
--></noscript>


<script type="text/javascript">
alert(document.getElementById('collector').innerText)
</script>

Erolast 08.03.2016 12:14

Цитата:

Вопрос был какой сборщик умеет файлы по комментариям в них собирать.
А зачем именно по комментариям? Почему не языковой конструкцией?

Цитата:

А es6 с babel это очень модно и здорово, так что мою карму ещё заминусят, когда скажу, что на coffeescript все равно писать быстрее и удобней.
Пиши на кофе, какая разница-то.

module.exports =
    cool: "stuff"
    answer: 42
    external: require "./cup2.coffee"
    again: require "./cup2

Romaboy 08.03.2016 15:25

На кофе имею в виду сам сборщик, а реквайры в комментах это ведь самый удобный способ линковки, во всех языках есть комментарии, а способа в эту строчу файл вставить не во всех, css например. Вот и получается странно, что rails из коробки умеет, ни один сборщик не может

Erolast 08.03.2016 17:10

Цитата:

На кофе имею в виду сам сборщик
А? Какая тебе разница, на каком языке сборщик написан?) Ты ж даже смотреть на его код не будешь, использовать только через API.

Цитата:

а реквайры в комментах это ведь самый удобный способ линковки
Чем удобнее, чем напрямую в коде? :blink:

Romaboy 08.03.2016 19:28

Цитата:

Сообщение от Erolast (Сообщение 410308)
Чем удобнее, чем напрямую в коде? :blink:

Как это чем удобнее... Хорошо, есть главный скрипт app.coffee и рядом папка folder, надо из этой папки все скрипты подключить в app.coffee. Мой сборщик, который уже готов почти:
#= require_tree folder

Напрямую в коде:
require вручную все файлы, во всех файлах прописать module.exports, и эт не все, надо ещё browserify'ем это для браузера собрать. Как быть с css в аналогичной ситуации вовсе неясно. Серьезно что то о чем тема никому не надо и кроме меня никто это удобным не считает? Не пойму я вас

Romaboy 08.03.2016 21:01

Закончил! Можно пользоваться теперь, вот мой сборщик-красавец:
https://github.com/Romaboy/lairs/blo...watcher.coffee
А вот его конфиг для работы:
https://github.com/Romaboy/lairs/blo...r/watch.coffee
Вкратце как пользоваться:
watcher = require './watcher'

это функция, которая принимает конфиг и сразу начинает следить за папками
'app/assets':

это где за файлами следить
out: 'public/assets'

это куда их собирать и транслейтить
dest: (split, last) -> split[3..last]

Это может не совсем удобно сделал, функция принимает массив типа app, assets, stylesheets, fonts и возвращает массив fonts, чтобы шрифты клались не куда-нибудь, а в out (public/assets) + fonts
includes:

Тут список какие форматы могут собираться по волшебным комментам
star: true

В css комментарии со звездочками /*\n*= require ... \n*\
slash: true

В stylus'е и js комменты есть по слешам: //= require ...
sharp: true

А в кофе комменты есть такие: #, а есть ещё такие: ### ... ### и оба типа могут содержать реквайры.
В кофе кроме комментов ### есть ещё строки """, одна из причин его обожания.
compile:

А в этой секции у меня компиляторы. Как делает gulp: специально для него люди делают обертки компиляторов. Как у меня: все просто! Немного разобраться с api stylus или coffee и можно написать простенькую функцию, большинство подобного есть на node.js. Есть луа-клон кофискрипта moonscript, вот его на node.js нет, в таком случае в моем примере есть функция moon, где файл превращается с помощью вызова системной команды.
Запускаю так: coffee watch.coffee
Работает очень даже шустренько

Erolast 08.03.2016 21:02

Цитата:

require вручную все файлы
Ну, необязательно вручную, можно
for (let file of fs.readDirSync("modules")) {
  require(file);
}


Но окей, как знаешь.


Часовой пояс GMT +3, время: 15:01.