ΠΠΠ β ΡΡΠΎ ΠΌΠ΅ΡΠΎΠ΄ΠΎΠ»ΠΎΠ³ΠΈΡ ΡΡΡΠ΅ΠΊΡΠΈΠ²Π½ΠΎΠΉ ΡΠ°Π·ΡΠ°Π±ΠΎΡΠΊΠΈ Π²Π΅Π±-ΠΏΡΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠΉ. ΠΠΎΠ»ΡΡΠΎΠ΅ ΠΊΠΎΠ»ΠΈΡΠ΅ΡΡΠ²ΠΎ ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΠΈ ΡΠ°Π·ΠΌΠ΅ΡΠ΅Π½ΠΎ Π½Π° ΠΎΡΠΈΡΠΈΠ°Π»ΡΠ½ΠΎΠΌ ΡΠ°ΠΉΡΠ΅ http://ru.bem.info.
Bemaker ΡΡΡΠ΅ΠΌΠΈΡΡΡ Π²ΠΎΠΏΠ»ΠΎΡΠΈΡΡ Π½Π°ΠΈΠ±ΠΎΠ»Π΅Π΅ ΠΏΡΠΎΡΡΠΎΠΉ ΡΠΏΠΎΡΠΎΠ± ΡΠ±ΠΎΡΠΊΠΈ ΠΏΡΠΎΠ΅ΠΊΡΠ° Π² ΠΠΠ-ΡΠ΅ΡΠΌΠΈΠ½Π°Ρ .
npm install bemaker
Bemaker Π½Π΅ΠΏΡΠΈΡ ΠΎΡΠ»ΠΈΠ² ΠΊ ΡΠ°ΠΉΠ»ΠΎΠ²ΠΎΠΉ ΡΡΡΡΠΊΡΡΡΠ΅, Π½Π°ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΡΠΎ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎ.
ΠΠ°ΡΡΠ΄Ρ Ρ ΠΎΠ±ΡΡΠ½ΡΠΌΠΈ ΡΠ°ΠΉΠ»Π°ΠΌΠΈ, Π² ΡΠ±ΠΎΡΠΊΠ΅ ΡΠ°ΠΊ ΠΆΠ΅ ΡΡΠ°ΡΡΠ²ΡΡΡ ΡΠΈΠΌΠ²ΠΎΠ»ΡΠ½ΡΠ΅ ΡΡΡΠ»ΠΊΠΈ.
ΠΠΆΠΈΠ΄Π°Π΅ΡΡΡ, ΡΡΠΎ ΠΈΠΌΠ΅Π΅ΡΡΡ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ, Ρ ΡΠ°Π½ΡΡΠ°Ρ Π² ΡΠ΅Π±Π΅ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ Π±Π»ΠΎΠΊΠΎΠ², Π²Π½ΡΡΡΠΈ ΠΊΠ°ΠΆΠ΄ΠΎΠΉ ΠΈΠ· ΠΊΠΎΡΠΎΡΡΡ ΡΠ°ΡΠΏΠΎΠ»Π°Π³Π°ΡΡΡΡ ΡΠ°ΠΉΠ»Ρ Π±Π»ΠΎΠΊΠ° Π² ΠΏΡΠΎΠΈΠ·Π²ΠΎΠ»ΡΠ½ΠΎΠΉ ΠΈΠ΅ΡΠ°ΡΡ ΠΈΠΈ.
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
blocks/
button/
button.js
button.css
input/
input.js
input.css
ΠΠ»Ρ ΡΠΊΠ°Π·Π°Π½ΠΈΡ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΉ Ρ Π±Π»ΠΎΠΊΠ°ΠΌΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ
ΠΎΠΏΡΠΈΡ directories
.
Π ΠΈΠΌΠ΅Π½Π°Ρ ΡΠ°ΠΉΠ»ΠΎΠ² ΡΠ»Π΅ΠΌΠ΅Π½ΡΠΎΠ² ΠΈ ΠΌΠΎΠ΄ΠΈΡΠΈΠΊΠ°ΡΠΎΡΠΎΠ² ΠΌΠΎΠΆΠ½ΠΎ Π½Π΅ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ ΠΈΠΌΡ Π±Π»ΠΎΠΊΠ°, ΡΠ±ΠΎΡΡΠΈΠΊ Π΄ΠΎΡΡΡΠΎΠΈΡ Π΅Π³ΠΎ ΡΠ°ΠΌΠΎΡΡΠΎΡΡΠ΅Π»ΡΠ½ΠΎ ΠΈΡΡ ΠΎΠ΄Ρ ΠΈΠ· Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ Π±Π»ΠΎΠΊΠ°.
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ:
blocks/
input/
input.js
__label.js // input__label.js
_size_s.css // input_size_s.css
ΠΠ»Ρ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π° ΡΠ°ΡΡΡΠΈΡΡΠ²Π°Π΅ΡΡΡ Π²Π΅Ρ, ΠΏΠΎ ΠΊΠΎΡΠΎΡΠΎΠΌΡ Π² Π΄Π°Π»ΡΠ½Π΅ΠΉΡΠ΅ΠΌ Π±ΡΠ΄Π΅Ρ ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΡΡΡΡ ΠΏΡΠΈΠΎΡΠΈΡΠ΅Ρ Π΅Π³ΠΎ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΡΡΠ΅Π΄ΠΈ ΠΏΡΠΎΡΠΈΡ ΡΠ°ΠΉΠ»ΠΎΠ² Π±Π»ΠΎΠΊΠ°.
ΠΠ΅Ρ ΡΠ°ΠΉΠ»Π° ΡΠ°ΡΡΡΠΈΡΡΠ²Π°Π΅ΡΡΡ Ρ ΠΏΠΎΠΌΠΎΡΡΡ ΠΌΠ΅ΡΠΎΠ΄Π° weight
ΠΌΠΎΠ΄ΡΠ»Ρ Selector
ΠΠΠ-ΡΠ°Π±Π»ΠΎΠ½ΠΈΠ·Π°ΡΠΎΡΠ° Bemer.
Π ΠΎΠ±ΡΠ΅ΠΌ Π²ΠΈΠ΄Π΅ ΠΏΠΎΡΡΠ΄ΠΎΠΊ ΠΏΠΎΠ΄ΠΊΠ»ΡΡΠ΅Π½ΠΈΡ ΡΠ°ΠΉΠ»ΠΎΠ² ΡΠ»Π΅Π΄ΡΡΡΠΈΠΉ:
block
block_mod
block_mod_val
block__elem
block_mod__elem
block_mod_val__elem
block__elem_mod
block__elem_mod_val
block_mod__elem_mod_val
block_mod_val__elem_mod_val
ΠΠΎΠ΄Π΄Π΅ΡΠΆΠΈΠ²Π°Π΅ΡΡΡ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ Π·Π²ΡΠ·Π΄ΠΎΡΠ΅ΠΊ Π²ΠΌΠ΅ΡΡΠΎ ΡΠ°ΡΡΠ΅ΠΉ ΠΠΠ-ΠΈΠΌΡΠ½, ΡΡΠΎ ΡΠ΄ΠΎΠ±Π½ΠΎ Π΄Π»Ρ Π²ΡΠ΄Π΅Π»Π΅Π½ΠΈΡ ΠΎΠ±ΡΠ΅Π³ΠΎ ΠΊΠΎΠ΄Π° Π² ΠΎΠ΄Π½ΠΎΠΌ ΠΌΠ΅ΡΡΠ΅. Π£ ΠΈΠΌΡΠ½ ΡΠΎ Π·Π²ΡΠ·Π΄ΠΎΡΠΊΠ°ΠΌΠΈ ΠΏΡΠΈΠΎΡΠΈΡΠ΅Ρ Π½ΠΈΠΆΠ΅, ΡΠ΅ΠΌ Ρ ΠΈΠΌΡΠ½ Π±Π΅Π· Π·Π²ΡΠ·Π΄ΠΎΡΠ΅ΠΊ.
ΠΡΠΈΠΌΠ΅ΡΡ ΠΈΠΌΡΠ½ ΡΠΎ Π·Π²ΡΠ·Π΄ΠΎΡΠΊΠ°ΠΌΠΈ: block_mod_*
, block__*
ΠΈ ΡΠ°ΠΊ Π΄Π°Π»Π΅Π΅.
Bemaker ΠΏΠ΅ΡΠ΅Π±ΠΈΡΠ°Π΅Ρ Π²ΡΠ΅ ΡΠ°ΠΉΠ»Ρ Π²Π½ΡΡΡΠΈ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ Π±Π»ΠΎΠΊΠ° Π²Π½Π΅ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ ΠΎΡ ΠΈΠ΅ΡΠ°ΡΡ ΠΈΠΈ Π²Π»ΠΎΠΆΠ΅Π½Π½ΠΎΡΡΠΈ.
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π² ΠΎΡΠ»ΠΈΡΠΈΠΈ ΠΎΡ ΠΏΡΠΈΠΌΠ΅ΡΠ°, ΠΏΡΠΈΠ²Π΅Π΄ΡΠ½Π½ΠΎΠ³ΠΎ Π²ΡΡΠ΅, ΠΌΠΎΠΆΠ½ΠΎ ΠΏΠΎΠ»ΠΎΠΆΠΈΡΡ ΡΠ°ΠΉΠ»Ρ ΡΠ»Π΅ΠΌΠ΅Π½ΡΠ° ΠΈ ΠΌΠΎΠ΄ΠΈΡΠΈΠΊΠ°ΡΠΎΡΠ° Π² Π΄ΠΎΠΏΠΎΠ»Π½ΠΈΡΠ΅Π»ΡΠ½ΡΠ΅ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ:
blocks/
input/
input.js
__label/
__label.js
_size/
_size_s.css
Π ΠΏΡΠΎΠ΅ΠΊΡΠ΅ ΠΌΠΎΠΆΠ΅Ρ Π±ΡΡΡ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΉ Ρ Π±Π»ΠΎΠΊΠ°ΠΌΠΈ, ΡΠΎΠ³Π΄Π° ΡΡΠΈ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΈ Π½Π°Π·ΡΠ²Π°ΡΡΡΡ ΡΡΠΎΠ²Π½ΡΠΌΠΈ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ.
Π‘ΠΌΡΡΠ» Π·Π°ΠΊΠ»ΡΡΠ°Π΅ΡΡΡ Π² ΡΠΎΠΌ, ΡΡΠΎ bemaker Π±ΡΠ΄Π΅Ρ ΡΠΎΠ±ΠΈΡΠ°ΡΡ ΡΠ°ΠΉΠ»Ρ Π±Π»ΠΎΠΊΠΎΠ² ΡΠ½Π°ΡΠ°Π»Π° Ρ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΡΡΠΎΠ²Π½Ρ, Π° Π·Π°ΡΠ΅ΠΌ ΡΠΎ ΡΠ»Π΅Π΄ΡΡΡΠΈΡ Π² Π·Π°Π΄Π°Π½Π½ΠΎΠΌ ΠΏΠΎΡΡΠ΄ΠΊΠ΅.
ΠΡΠΎ ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ ΠΊΠΎΠ½ΡΡΠΎΠ»ΠΈΡΠΎΠ²Π°ΡΡ ΠΏΠΎΡΡΠ΄ΠΎΠΊ Π½Π°ΡΠ»Π΅Π΄ΠΎΠ²Π°Π½ΠΈΡ ΡΠΊΡΠΈΠΏΡΠΎΠ² ΠΈ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ ΡΡΠΈΠ»Π΅ΠΉ Π±Π»ΠΎΠΊΠΎΠ².
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, Π±Π»ΠΎΠΊΠΈ ΠΌΠΎΠ³ΡΡ Π±ΡΡΡ ΡΠ°Π·Π»ΠΎΠΆΠ΅Π½Ρ ΠΏΠΎ ΡΡΠΎΠ²Π½ΡΠΌ ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»Π΅Π½ΠΈΡ, ΡΠΎΠΎΡΠ²Π΅ΡΡΡΠ²ΡΡΡΠΈΠΌ ΠΏΠ»Π°ΡΡΠΎΡΠΌΠ°ΠΌ ΡΡΡΡΠΎΠΉΡΡΠ² ΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°ΡΠ΅Π»Ρ:
common/ // ΠΎΠ±ΡΠ°Ρ ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΡ Π±Π»ΠΎΠΊΠΎΠ²
input/
input.css
phone/ // ΡΡΠΎΡΠ½Π΅Π½ΠΈΡ Π΄Π»Ρ ΡΠ΅Π»Π΅ΡΠΎΠ½ΠΎΠ²
input/
input.css // ΠΏΠ΅ΡΠ΅ΠΎΠΏΡΠ΅Π΄Π΅Π»ΡΠ΅ΠΌ ΡΡΠΈΠ»ΠΈ Π΄Π»Ρ ΡΠ΅Π»Π΅ΡΠΎΠ½ΠΎΠ²
ΠΠ΅ΠΊΠΎΡΠΎΡΡΠ΅ Π±Π»ΠΎΠΊΠΈ ΠΎΡΠ½ΠΎΠ²Π°Π½Ρ Π½Π° ΡΠ΅Π°Π»ΠΈΠ·Π°ΡΠΈΠΈ Π΄ΡΡΠ³ΠΈΡ Π±Π»ΠΎΠΊΠΎΠ², Π΄Π»Ρ ΡΠΊΠ°Π·Π°Π½ΠΈΡ ΡΠ²ΡΠ·Π΅ΠΉ ΠΌΠ΅ΠΆΠ΄Ρ Π½ΠΈΠΌΠΈ ΠΏΡΠ΅Π΄ΡΡΠΌΠΎΡΡΠ΅Π½Π° Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡΡ Π·Π°ΠΏΠΈΡΠΈ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ.
ΠΠ°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ Π·Π°ΠΏΠΈΡΡΠ²Π°ΡΡΡΡ Π² JSDoc-ΡΠΎΡΠΌΠ°ΡΠ΅.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΏΠΎΠΈΡΠΊ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ ΠΎΡΡΡΠ΅ΡΡΠ²Π»ΡΠ΅ΡΡΡ Π² js-ΡΠ°ΠΉΠ»Π°Ρ
ΠΈ ΡΠ΅Π³Π°Ρ
@bemaker
, ΡΠΊΠ°Π·Π°Π½Π½ΡΡ
Π³Π΄Π΅-Π»ΠΈΠ±ΠΎ Π² JSDoc.
Π ΠΎΠ΄Π½ΠΎΠΌ ΡΠ΅Π³Π΅ ΠΌΠΎΠΆΠ½ΠΎ ΡΠΊΠ°Π·Π°ΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΎΠ΄ΠΈΠ½ Π±Π»ΠΎΠΊ.
ΠΠ°ΠΏΡΠΈΠΌΠ΅Ρ, ΡΠ°ΠΉΠ» select.js
Π³ΠΎΠ²ΠΎΡΠΈΡ ΠΎ ΡΠΎΠΌ,
ΡΡΠΎ Π±Π»ΠΎΠΊ select
Π·Π°Π²ΠΈΡΠΈΡ ΠΎΡ Π±Π»ΠΎΠΊΠΎΠ² button
ΠΈ popup
:
/**
* @bemaker button
* @bemaker popup
*/
ΠΠ»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΡ ΡΠ°ΠΉΠ»ΠΎΠ² Ρ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΡΠΌΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ
ΠΎΠΏΡΠΈΡ dependext
.
ΠΠ»Ρ ΠΈΠ·ΠΌΠ΅Π½Π΅Π½ΠΈΡ ΠΈΠΌΠ΅Π½ΠΈ JSDoc-ΡΠ΅Π³Π° ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΡΡΡ
ΠΎΠΏΡΠΈΡ jsdoctag
.
ΠΠΎΡΠ»Π΅ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΠΈ ΠΈΠ· npm
Π±ΡΠ΄Π΅Ρ Π΄ΠΎΡΡΡΠΏΠ΅Π½
ΠΈΡΠΏΠΎΠ»Π½ΡΠ΅ΠΌΡΠΉ ΡΠ°ΠΉΠ»: ./node_modules/.bin/bemaker
.
Π‘ ΠΏΠΎΠΌΠΎΡΡΡ ΠΊΠΎΠΌΠ°Π½Π΄Ρ make
Π·Π°ΠΏΡΡΠΊΠ°Π΅ΡΡΡ ΡΠ±ΠΎΡΠΊΠ° ΠΏΡΠΎΠ΅ΠΊΡΠ°.
ΠΠ»Ρ ΡΡΠΎΡΠ½Π΅Π½ΠΈΡ Π΄Π΅ΡΠ°Π»Π΅ΠΉ ΡΠ±ΠΎΡΠΊΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΡΡΡΡ ΠΎΠΏΡΠΈΠΈ.
ΠΡΠ²Π΅ΡΡΠΈ ΡΠΏΡΠ°Π²ΠΊΡ ΠΏΠΎ ΠΈΡΠΏΠΎΠ»ΡΠ·ΠΎΠ²Π°Π½ΠΈΡ bemaker
Π² ΡΠ΅ΡΠΌΠΈΠ½Π°Π»Π΅:
$ bemaker --help
ΠΡΠ²Π΅ΡΡΠΈ ΡΠΏΡΠ°Π²ΠΊΡ ΠΏΠΎ ΠΊΠΎΠΌΠ°Π½Π΄Π΅ make
:
$ bemaker make --help
ΠΡΠ²Π΅ΡΡΠΈ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅ΠΌΡΡ Π²Π΅ΡΡΠΈΡ bemaker
.
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π½Π° ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΡΠΉ ΡΠ°ΠΉΠ», ΡΠΎΠ΄Π΅ΡΠΆΠ°ΡΠΈΠΉ Π²ΡΠ΅ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΡΠ΅ ΠΎΠΏΡΠΈΠΈ ΡΠ±ΠΎΡΠΊΠΈ Π² JSON-ΡΠΎΡΠΌΠ°ΡΠ΅.
ΠΡΠ»ΠΈ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ, Π² ΠΊΠΎΡΠΎΡΠΎΠΉ Π²ΡΠΏΠΎΠ»Π½ΡΠ΅ΡΡΡ Π·Π°ΠΏΡΡΠΊ ΠΊΠΎΠΌΠ°Π½Π΄Ρ,
ΡΠΎΠ΄Π΅ΡΠΆΠΈΡ ΡΠ°ΠΉΠ» bemaker.json
β ΡΠ±ΠΎΡΡΠΈΠΊ ΠΈΡΠΏΠΎΠ»ΡΠ·ΡΠ΅Ρ Π΅Π³ΠΎ
ΠΊΠ°ΠΊ ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΡΠΉ ΡΠ°ΠΉΠ» Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ.
Π ΡΠ»Π΅Π΄ΡΡΡΠ΅ΠΌ ΠΏΡΠΈΠΌΠ΅ΡΠ΅ ΡΠΊΠ°Π·ΡΠ²Π°Π΅ΡΡΡ ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΡΠΉ ΡΠ°ΠΉΠ»:
$ bemaker make -c path/to/myconfig.json
Π ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅ ΠΏΡΡΠΈ Π΄ΠΎ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΉ ΠΈ ΡΠ°ΠΉΠ»ΠΎΠ² ΡΠ»Π΅Π΄ΡΠ΅Ρ ΡΠΊΠ°Π·ΡΠ²Π°ΡΡ ΠΎΡΠ½ΠΎΡΠΈΡΠ΅Π»ΡΠ½ΠΎ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π°.
ΠΠΏΡΠΈΠΈ, Π²Π²Π΅Π΄ΡΠ½Π½ΡΠ΅ Π² ΠΊΠΎΠΌΠ°Π½Π΄Π½ΠΎΠΉ ΡΡΡΠΎΠΊΠ΅ ΠΈΠΌΠ΅ΡΡ ΠΏΡΠΈΠΎΡΠΈΡΠ΅Ρ Π½Π°Π΄ ΠΎΠΏΡΠΈΡΠΌΠΈ ΠΈΠ· ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π°.
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΎΠ΄Π½Ρ ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΉ Ρ Π±Π»ΠΎΠΊΠ°ΠΌΠΈ.
Π‘Π±ΠΎΡΡΠΈΠΊ Π½ΠΈΡΠ΅Π³ΠΎ Π½Π΅ ΡΠΎΠ±Π΅ΡΡΡ Π±Π΅Π· ΡΠΊΠ°Π·Π°Π½ΠΈΡ ΡΠ°ΡΠΏΠΎΠ»ΠΎΠΆΠ΅Π½ΠΈΡ Π±Π»ΠΎΠΊΠΎΠ².
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°Π΄Π°ΡΡ ΡΠ±ΠΎΡΠΊΡ Π±Π»ΠΎΠΊΠΎΠ² ΠΈΠ· Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΠΉ common
ΠΈ phone
:
$ bemaker make -d common,phone
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"directories": ["common", "phone"]
}
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΈΠΌΡ ΡΠΎΡ ΡΠ°Π½ΡΠ΅ΠΌΡΡ ΡΠ°ΠΉΠ»ΠΎΠ².
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΡΠ°ΠΉΠ»Ρ ΡΠΎΡ ΡΠ°Π½ΡΡΡΡΡ Π±Π΅Π· ΠΈΠΌΠ΅Π½ΠΈ, ΡΠΎΠ»ΡΠΊΠΎ Ρ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ΠΌ.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°Π΄Π°ΡΡ ΡΠΎΡ
ΡΠ°Π½ΡΠ΅ΠΌΡΠΌ ΡΠ°ΠΉΠ»Π°ΠΌ ΠΈΠΌΡ all
:
$ bemaker make -O all
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"outname": "all"
}
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ Π΄Π»Ρ ΡΠΎΡ ΡΠ°Π½ΡΠ΅ΠΌΡΡ ΡΠ°ΠΉΠ»ΠΎΠ². ΠΡΠ»ΠΈ ΡΠΊΠ°Π·Π°Π½Π½Π°Ρ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ Π½Π΅ ΡΡΡΠ΅ΡΡΠ²ΡΠ΅Ρ β ΠΎΠ½Π° Π±ΡΠ΄Π΅Ρ ΡΠΎΠ·Π΄Π°Π½Π° Π°Π²ΡΠΎΠΌΠ°ΡΠΈΡΠ΅ΡΠΊΠΈ.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΡΠ°ΠΉΠ»Ρ ΡΠΎΡ ΡΠ°Π½ΡΡΡΡΡ Π² ΡΠ΅ΠΊΡΡΡΡ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°Π΄Π°ΡΡ Π΄ΠΈΡΠ΅ΠΊΡΠΎΡΠΈΡ bundle
Π΄Π»Ρ ΡΠΎΡ
ΡΠ°Π½ΡΠ΅ΠΌΡΡ
ΡΠ°ΠΉΠ»ΠΎΠ²:
$ bemaker make -o bundle
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"outdir": "bundle"
}
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΎΠ΄Π½ΠΎ ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΎ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠΉ Π΄Π»Ρ ΡΠΎΡ ΡΠ°Π½ΡΠ΅ΠΌΡΡ ΡΠ°ΠΉΠ»ΠΎΠ².
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΡΠΎΡ ΡΠ°Π½ΡΡΡΡΡ Π²ΡΠ΅ Π½Π°ΠΉΠ΄Π΅Π½Π½ΡΠ΅ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΡ.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°Π΄Π°ΡΡ ΠΊ ΡΠΎΡ
ΡΠ°Π½Π΅Π½ΠΈΡ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΡ .js
ΠΈ .css
:
$ bemaker make -e .js,.css
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"extensions": [".js", ".css"]
}
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΈΠΌΡ ΠΎΠ΄Π½ΠΎΠ³ΠΎ ΠΈΠ»ΠΈ Π½Π΅ΡΠΊΠΎΠ»ΡΠΊΠΈΡ Π±Π»ΠΎΠΊΠΎΠ², ΠΊΠΎΡΠΎΡΡΠ΅ Π½Π΅ΠΎΠ±Ρ ΠΎΠ΄ΠΈΠΌΠΎ ΡΠΎΠ±ΡΠ°ΡΡ.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π² ΡΠ±ΠΎΡΠΊΡ Π²ΠΊΠ»ΡΡΠ°ΡΡΡΡ Π²ΡΠ΅ Π½Π°ΠΉΠ΄Π΅Π½Π½ΡΠ΅ Π±Π»ΠΎΠΊΠΈ.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°Π΄Π°ΡΡ ΠΊ ΡΠ±ΠΎΡΠΊΠ΅ ΡΠΎΠ»ΡΠΊΠΎ Π±Π»ΠΎΠΊΠΈ button
ΠΈ input
:
$ bemaker make -b button,input
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"blocks": ["button", "input"]
}
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ ΡΠ°ΠΉΠ»ΠΎΠ², Π² ΠΊΠΎΡΠΎΡΡΡ ΡΠ±ΠΎΡΡΠΈΠΊΡ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΠΈΡΠΊΠ°ΡΡ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ Π±Π»ΠΎΠΊΠΎΠ².
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΠΏΠΎΠΈΡΠΊ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ ΠΎΡΡΡΠ΅ΡΡΠ²Π»ΡΠ΅ΡΡΡ Π² ΡΠ°ΠΉΠ»Π°Ρ
Ρ ΡΠ°ΡΡΠΈΡΠ΅Π½ΠΈΠ΅ΠΌ .js
.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°Π΄Π°ΡΡ ΠΏΠΎΠΈΡΠΊ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ Π² ΡΠ°ΠΉΠ»Π°Ρ
.deps.js
:
$ bemaker make --dependext .deps.js
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"dependext": ".deps.js"
}
ΠΠΏΡΠΈΡ ΡΠΊΠ°Π·ΡΠ²Π°Π΅Ρ ΠΈΠΌΡ JSDoc-ΡΠ΅Π³Π°, Π² ΠΊΠΎΡΠΎΡΠΎΠΌ ΡΠ±ΠΎΡΡΠΈΠΊΡ ΡΠ»Π΅Π΄ΡΠ΅Ρ ΡΠΈΡΠ°ΡΡ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠΈ Π±Π»ΠΎΠΊΠΎΠ².
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ ΡΡΠ΅Π½ΠΈΠ΅ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ ΠΎΡΡΡΠ΅ΡΡΠ²Π»ΡΠ΅ΡΡΡ Π² ΡΠ΅Π³Π΅ @bemaker
.
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π·Π°Π΄Π°ΡΡ ΡΡΠ΅Π½ΠΈΠ΅ Π·Π°Π²ΠΈΡΠΈΠΌΠΎΡΡΠ΅ΠΉ Π² ΡΠ΅Π³Π΅ @deps
:
$ bemaker make --jsdoctag deps
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"jsdoctag": "deps"
}
ΠΠΏΡΠΈΡ ΠΎΡΠΌΠ΅Π½ΡΠ΅Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΡ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡ ΠΏΠ΅ΡΠ΅Π΄ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΡΠΌ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π°.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π² ΡΠΎΠ±ΡΠ°Π½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅ ΠΏΠ΅ΡΠ΅Π΄ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΡΠΌ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π° ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΡΡΡ ΡΠ°ΠΊΠΎΠ³ΠΎ Π²ΠΈΠ΄Π° ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ:
/* before: blocks/button/button.css */
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ ΠΎΡΠΌΠ΅Π½ΡΠ΅Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΡ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡ:
$ bemaker make --no-before
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"before": false
}
ΠΠΏΡΠΈΡ ΠΎΡΠΌΠ΅Π½ΡΠ΅Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΡ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π°.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π² ΡΠΎΠ±ΡΠ°Π½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅ ΠΏΠΎΡΠ»Π΅ ΡΠΎΠ΄Π΅ΡΠΆΠΈΠΌΠΎΠ³ΠΎ ΠΊΠ°ΠΆΠ΄ΠΎΠ³ΠΎ ΡΠ°ΠΉΠ»Π° ΡΡΡΠ°Π½Π°Π²Π»ΠΈΠ²Π°Π΅ΡΡΡ ΡΠ°ΠΊΠΎΠ³ΠΎ Π²ΠΈΠ΄Π° ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΠΉ:
/* after: blocks/button/button.css */
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ ΠΎΡΠΌΠ΅Π½ΡΠ΅Ρ ΡΡΡΠ°Π½ΠΎΠ²ΠΊΡ ΠΊΠΎΠΌΠΌΠ΅Π½ΡΠ°ΡΠΈΡ:
$ bemaker make --no-after
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"after": false
}
Π ΠΏΡΠΎΡΠ΅ΡΡΠ΅ ΡΠ±ΠΎΡΠΊΠΈ Π²ΡΠ²ΠΎΠ΄ΡΡΡΡ ΡΠ°Π·Π»ΠΈΡΠ½ΡΠ΅ ΡΠΈΠΏΡ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠΉ.
ΠΠΎ ΡΠΌΠΎΠ»ΡΠ°Π½ΠΈΡ Π²ΡΠ²ΠΎΠ΄ΡΡΡΡ Π²ΡΠ΅ ΡΠΈΠΏΡ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠΉ.
ΠΠΏΡΠΈΡ verbose
ΠΏΠΎΠ·Π²ΠΎΠ»ΡΠ΅Ρ Π½Π°ΡΡΡΠΎΠΈΡΡ Π²ΡΠ²ΠΎΠ΄ ΡΠΎΠ»ΡΠΊΠΎ Π½Π΅ΠΊΠΎΡΠΎΡΡΡ
ΡΠΈΠΏΠΎΠ².
ΠΡΠ²ΠΎΠ΄ΠΈΠΌΡΠ΅ ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΡ Π΄Π΅Π»ΡΡΡΡ Π½Π° ΡΠ»Π΅Π΄ΡΡΡΠΈΠ΅ ΡΠΈΠΏΡ:
log
β ΠΈΠ½ΡΠΎΡΠΌΠ°ΡΠΈΡ ΠΎ ΠΏΡΠΎΡΠ΅ΡΡΠ΅ ΡΠ±ΠΎΡΠΊΠΈ (ΡΠΈΠ½ΠΈΠΌ ΡΠ²Π΅ΡΠΎΠΌ)info
β ΡΠΎΠΎΠ±ΡΠ΅Π½ΠΈΠ΅ ΠΎ ΡΠ΅Π·ΡΠ»ΡΡΠ°ΡΠ΅ ΡΠ±ΠΎΡΠΊΠΈ (Π·Π΅Π»ΡΠ½ΡΠΌ)warn
β ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΡ (ΠΆΡΠ»ΡΡΠΌ)error
β ΠΎΡΠΈΠ±ΠΊΠΈ (ΠΊΡΠ°ΡΠ½ΡΠΌ)
Π‘Π»Π΅Π΄ΡΡΡΠΈΠΉ ΠΏΡΠΈΠΌΠ΅Ρ Π±ΡΠ΄Π΅Ρ Π²ΡΠ²ΠΎΠ΄ΠΈΡΡ ΡΠΎΠ»ΡΠΊΠΎ ΠΏΡΠ΅Π΄ΡΠΏΡΠ΅ΠΆΠ΄Π΅Π½ΠΈΡ ΠΈ ΠΎΡΠΈΠ±ΠΊΠΈ:
$ bemaker make -v warn,error
ΠΠ΄Π΅Π½ΡΠΈΡΠ½ΡΠΉ ΠΏΡΠΈΠΌΠ΅Ρ ΠΎΠΏΡΠΈΠΈ Π² ΠΊΠΎΠ½ΡΠΈΠ³ΡΡΠ°ΡΠΈΠΎΠ½Π½ΠΎΠΌ ΡΠ°ΠΉΠ»Π΅:
{
"verbose": ["warn", "error"]
}