Page 53 - Браун Э. - Изучаем JavaScript. Руководство по созданию современных веб-сайтов - 2017
P. 53
Gulp использует концепцию конвейера (pipeline). Мы начинаем с сообщения Gulp
о расположении интересующих нас файлов: src ( "еsб / * * / * . j " ) . Вы могли бы за
s
даться вопросом о * *; это шаблон для "любого каталога, включая подкаталоги': Та
ким образом, этот фильтр выберет все файлы . j s в каталоге s б и любых его под
е
каталогах, независимо от глубины. Затем мы транспортируем (pipe) эти файлы ис
ходного кода в Babel, который преобразует их из ЕSб в ESS. На завершающем этапе
откомпилированный код ESS транспортируется по назначению, в каталог dist. Gulp
сохранит имена и структуру каталогов ваших файлов исходного кода. Например,
e
файл s б / a . j s будет откомпилирован в dis t / a . j s , а e s б / a / Ь / c . j s - в dis / a /
t
е
Ы j s. Мы повторим тот же процесс для файлов в каталоге pu Ы i c / s б .
с
.
Мы еще не изучили ЕSб, но давайте создадим файл примера кода ЕSб и удосто
веримся в работоспособности нашей конфигурации Gulp. Создайте файл esб / t est .
j s, содержащий часть новых средств ЕSб (не расстраивайтесь, если не понимаете со
держимое этого файла; впоследствии вы все поймете!).
' u se strict ' ;
/ / средство еs б: блок "левых " объявлений
const sentences = [
subj ect : ' J avaScript ' , verb : ' i s ' , obj ect : ' g reat ' } ,
subj ect : ' E lephan s ' , verb : ' a r ' , ob e ct : ' l arge ' } ,
t
j
e
] ;
1 1 средство еsб: деструктуризация объекта
b
j
function say ( { su j e c t , verb , ob e ct } ) {
/ / средство еs б: строки шаблона
g
console . l o ( ' $ { s ubj ect } $ { verb } $ { o bjec } ' ) ;
t
}
1 1 средство еs б: for . of
.
for ( l et s of sentences ) {
y
sa ( s ) ;
Теперь создайте копию этого файла в каталоге pu Ы i c / e s б (вы можете изменить
содержимое массива sentences, если хотите удостовериться, что ваши файлы отли
чаются). Т е перь введите gulp и просмотрите каталоги dist и pu Ы i c / dist. Вы уви
дите файл test . j s в обоих каталогах. Давайте откроем этот файл и посмотрим, чем
он отличается от своего эквивалента ЕSб.
Т е перь давайте попробуем запустить код ЕSб непосредственно.
$ node esб/test . j s
/home/ethan/ l j e 3 / es 6/test . j s : 8
j
function say ( { subj ect , verb, ob e ct } ) {
SyntaxError : Unexpected token
at exports . run n ThisContext ( v m . j s : 5 3 : 1 6 )
i
a t Module . _compile (module . j s : 3 7 4 : 2 5 )

