search

bem / project-stub

deps
314 stars 199 forks source link

Начать работать с BEM - "очень легко" #69

Closed obenjiro closed 10 years ago

obenjiro commented 10 years ago

Сделал по инструкции

git clone https://github.com/bem/project-stub.git -b bem-core my-bem-project
cd my-bem-project
npm install

и сразу же получил ошибку

400 getting enb-borchick-1.1.1 ( как-то так )

Посмотрел а релиза 1.1.1 нигде не нашел - ландо. Ушел в package.json поменял на 1.1.0. npm i заработал. Все супер.

Дальше сделал

node_modules/bem/bin/bem server

И получил новую ошибку

can't finde module roole

npm i roole --save
(facepalm)

Ок повторил

node_modules/bem/bin/bem server

Куча варнингов и ни одной ошибки. Ну думаю я - это же БЭМ и пошел спокойно на http://localhost:8080/desktop.bundles/index - и что же я увидел. Голый HTML o_O

Во первых:

16:15:45.330 - warn: *** HTTP error: 404, /Users/12/Desktop/4pda4u/desktop.bundles/_index.css
16:15:45.342 - warn: *** HTTP error: 404, /Users/12/Desktop/4pda4u/desktop.bundles/_index.js

Почему варнинги? Не вижу в этом никакой логики. Выдавайте ошибки.

Во-вторых:

Что опять я сделал не так? как это вообще можно понять?

Вывод bem server:

node_modules/bem/bin/bem server
16:15:35.826 - info: bem 0.9.0
16:15:35.830 - info: Project root is '/Users/12/Desktop/4pda4u'
16:15:36.015 - info: Graph:
== root
 all
   build
     common.blocks*
     desktop.blocks*
     desktop.bundles*
       common.blocks*
       desktop.blocks*

16:15:36.020 - info: Server is listening on port 8080. Point your browser to http://localhost:8080/
16:15:43.433 - info: [i] Going to build 'desktop.bundles*' [1]
16:15:43.818 - info: [i] Going to build 'desktop.bundles/index*' [2]
16:15:43.858 - warn: Level at /Users/12/Desktop/4pda4u/desktop.bundles/index/blocks is not a directory
16:15:43.892 - info: [i] Going to build 'desktop.bundles/index' [3]
16:15:43.922 - info: [t] isValid() time for "desktop.bundles/index/index.bemdecl.js" [3]: 1ms
16:15:43.922 - info: [t] isValid() time for "desktop.bundles/index/index.deps.js" [3]: 0ms
16:15:43.922 - info: [*] make 'desktop.bundles/index/index.deps.js' [3]
16:15:44.013 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-core/libs/bem-pr/bem/techs/spec.js.js' not found on require search paths
16:15:44.014 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-core/libs/bem-pr/bem/techs/spec.js+browser.js+bemhtml.js' not found on require search paths
16:15:44.016 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-core/libs/bem-pr/bem/techs/spec.bemjson.js.js' not found on require search paths
16:15:44.094 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-core/libs/bem-pr/bem/techs/spec.js.js' not found on require search paths
16:15:44.096 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-core/libs/bem-pr/bem/techs/spec.js+browser.js+bemhtml.js' not found on require search paths
16:15:44.097 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-core/libs/bem-pr/bem/techs/spec.bemjson.js.js' not found on require search paths
16:15:44.248 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/bemhtml.js' not found on require search paths
16:15:44.250 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/vanilla.js.js' not found on require search paths
16:15:44.251 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/browser.js.js' not found on require search paths
16:15:44.253 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js.js' not found on require search paths
16:15:44.254 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js+browser.js+bemhtml.js' not found on require search paths
16:15:44.255 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.bemjson.js.js' not found on require search paths
16:15:44.353 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/bemhtml.js' not found on require search paths
16:15:44.354 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/vanilla.js.js' not found on require search paths
16:15:44.355 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/browser.js.js' not found on require search paths
16:15:44.356 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js.js' not found on require search paths
16:15:44.357 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js+browser.js+bemhtml.js' not found on require search paths
16:15:44.358 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.bemjson.js.js' not found on require search paths
16:15:44.419 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/bemhtml.js' not found on require search paths
16:15:44.420 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/vanilla.js.js' not found on require search paths
16:15:44.421 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/browser.js.js' not found on require search paths
16:15:44.422 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js.js' not found on require search paths
16:15:44.423 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js+browser.js+bemhtml.js' not found on require search paths
16:15:44.424 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.bemjson.js.js' not found on require search paths
16:15:44.492 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/bemhtml.js' not found on require search paths
16:15:44.493 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/vanilla.js.js' not found on require search paths
16:15:44.494 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-core/.bem/techs/browser.js.js' not found on require search paths
16:15:44.495 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js.js' not found on require search paths
16:15:44.497 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.js+browser.js+bemhtml.js' not found on require search paths
16:15:44.498 - warn: Tech module with path '/Users/12/Desktop/4pda4u/libs/bem-components/libs/bem-pr/bem/techs/spec.bemjson.js.js' not found on require search paths
16:15:44.512 - info: [t] Build time for "desktop.bundles/index/index.deps.js" [3]: 590ms
16:15:44.513 - info: [t] isValid() time for "desktop.bundles/index/index.bemhtml" [3]: 0ms
16:15:44.513 - info: [*] make 'desktop.bundles/index/index.bemhtml' [3]
16:15:44.513 - info: [t] isValid() time for "desktop.bundles/index/index.browser.js+bemhtml" [3]: 0ms
16:15:44.514 - info: [*] make 'desktop.bundles/index/index.browser.js+bemhtml' [3]
16:15:44.514 - info: [t] isValid() time for "desktop.bundles/index/index.roole" [3]: 1ms
16:15:44.514 - info: [*] make 'desktop.bundles/index/index.roole' [3]
16:15:44.985 - warn: Level at /Users/12/Desktop/4pda4u/desktop.bundles/index/blocks is not a directory
16:15:44.986 - warn: Level at /Users/12/Desktop/4pda4u/desktop.bundles/index/blocks is not a directory
16:15:44.989 - warn: Level at /Users/12/Desktop/4pda4u/desktop.bundles/index/blocks is not a directory
16:15:45.084 - info: [t] Build time for "desktop.bundles/index/index.bemhtml" [3]: 571ms
16:15:45.091 - info: [t] isValid() time for "desktop.bundles/index/_index.bemhtml.js" [3]: 4ms
16:15:45.095 - info: [t] isValid() time for "desktop.bundles/index/index.html" [3]: 3ms
16:15:45.101 - info: [t] Build time for "desktop.bundles/index/index.browser.js+bemhtml" [3]: 588ms
16:15:45.103 - info: [t] isValid() time for "desktop.bundles/index/_index.js" [3]: 1ms
16:15:45.175 - info: [t] Build time for "desktop.bundles/index/index.roole" [3]: 662ms
16:15:45.177 - info: [t] isValid() time for "desktop.bundles/index/index.css" [3]: 1ms
16:15:45.198 - info: [t] isValid() time for "desktop.bundles/index/_index.css" [3]: 21ms
16:15:45.201 - info: [t] Build total for "desktop.bundles/index": 1319ms
16:15:45.276 - info: [i] Going to build 'desktop.bundles*' [4]
16:15:45.324 - info: [i] Going to build 'desktop.bundles*' [5]
16:15:45.330 - warn: *** HTTP error: 404, /Users/12/Desktop/4pda4u/desktop.bundles/_index.css
16:15:45.342 - warn: *** HTTP error: 404, /Users/12/Desktop/4pda4u/desktop.bundles/_index.js
^C16:18:51.436 - info: Servers were stopped
awinogradov commented 10 years ago

Вероятно что-то пошло не так во время установки модулей npm i. Попробуй установить их заново. Также похоже что не отработал модуль bower-npm-install. Попробуй запустить его вручную. Сделай bem make -m clean и запусти сервер.

obenjiro commented 10 years ago

Ничего из выше перечисленного не помогло. bower-npm-intsall вообще ничего не выдает ( никакой информации )

Никаких ошибок, ничего. Проект собирается и не работает. ( также 404, /Users/12/Desktop/4pda4u/desktop.bundles/_index.css, 404, /Users/12/Desktop/4pda4u/desktop.bundles/_index.js )

sipayRT commented 10 years ago

только что проверил у себя - все ок. попробуй очистить все кэши - npm cache clean, bower cache clean. Затем снести node_modules и libs. И после этого запустить npm i. насчет "Голый HTML" - в конце адреса добавь /

awinogradov commented 10 years ago

Скрипты и стили не тянутся, потому что ты идешь по неправильному адресу. Когдты ты попадаешь в папку index, автоматом загружается index.html, только вот стили и скрипты нет. Тебе надо идти на полный адрес страницы, как и сказал @sipayRT выше попробуй добавить /, но по хорошему надо идти до /index.html

obenjiro commented 10 years ago 
npm cache clean
bower cache clean
rm -rf libs/
rm -rf node_modules/
npm i

далее добавил в конце адресса /

http://localhost:8080/desktop.bundles/index/

И уже не вижу 404 - но файл /Users/12/Desktop/4pda4u/desktop.bundles/_index.css - пустой

Сходил на ( как просил @verybigman ) 

http://localhost:8080/desktop.bundles/index/index.html

тоже самое CSS файл пуст

И опять же: 1) Ни одной обишки - ни где. Проект собирается но не работает 2) Если нужно ходить на пути с / - то почему не выдается даже предупреждения о том что я пошел не по верному пути?

tadatuta commented 10 years ago
  1. Проделал все по инструкции, все отлично. Записал 2-минутный ролик, чтобы не было сомнений, что в процессе есть хоть какая-то магия: https://yadi.sk/i/5dEN0mfSaErPn
  2. Про правильный путь, по которому нужно переходить, написано в документации: http://ru.bem.info/tutorials/project-stub/#Базовые-команды По поводу предупреждения. bem server — это в первую очередь просто сервер. Он получает от браузера запрос и, если запрос совпадает с тем, что описано в конфиге bem make, то сначала вызывается bem make для данного запроса, а потом результат отдается в браузер. Если же с конфигом ничего не совпало, сервер просто возвращает то, что запросили (картинки, шрифты и т.д.) В данном случае у сервера запросили несуществующий файл, про который в конфиге сборки ничего не сказано. Это равносильно запросу http://localhost:8080/trololo, поэтому вывести что-то, кроме собственно 404 не представляется возможным.

Т.е. очень похоже, что вся проблема связана исключительно с кэшем npm. Вылетела ошибка про отсутствие версии enb-borschik@1.1.1, хотя версия была выпущена 11 дней назад: https://www.npmjs.org/package/enb-borschik Из-за ошибки не отработал postinstall и, соответственно, не установились библиотеки со своими npm-зависимостями.

А пользоваться БЭМом и правда очень легко. Думаю, видео это подтверждает?