Project-stub is a template project repository used for BEM projects creation. It contains the minimal configuration files and folders you will need for quick start from scratch.

There are two main BEM libraries are linked here by default:

• bem-core
• bem-components

• Node.js 4+ is a platform built on JavaScript runtime for easily building fast, scalable network applications.
• Git Bash if you use Windows OS.

Note: If your operating system is Windows, you must run the following commands in Git Bash with administrator rights. Make sure that you launch Git Bash as an administrator.

The list of supported browsers depends on the bem-core and bem-components library versions.

Note: Internet Explorer 8.0 is not supported by default. To support IE8 you must follow the recomendations.

It's as easy as...

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

Note: Do not use root rights to install npm dependencies.

You may use ENB or gulp to build the project.

You can run enb commands via ./node_modules/.bin/enb.

./node_modules/.bin/enb make

or

./node_modules/.bin/gulp

To be able to run commands without typing a full path to an executable file (./node_modules/.bin/enb), use:

export PATH=./node_modules/.bin:$PATH

Now you can use enb or gulp from the root of your project.

enb make

or

gulp

Execute the following commands in your terminal.

./node_modules/.bin/enb server

You could use the npm start command to start the enb server without specifying the full path to the node_modules.

npm start

The development server is running. To check it out, navigate to http://localhost:8080/desktop.bundles/index/index.html.

You may also specify different port if 8080 is already taken by some other service:

npm start -- --port=8181

Press Ctrl + C while the terminal is your active window to stop the server.

It is possible to create blocks with bem create command:

bem create new-block

mkdir -p desktop.bundles/page
touch desktop.bundles/page/page.bemjson.js

And add following content:

module.exports = {
    block: 'page',
    title: 'page',
    head: [
        { elem: 'css', url: 'page.min.css' }
    ],
    scripts: [{ elem: 'js', url: 'page.min.js' }],
    content: [
       {
           block: 'new-block',
           content: [
               'block content'
           ]
       }
    ]
};

• Static page quick-start
• Starting your own BEM project
• Tutorial for BEMJSON template-engine
• Tutorial on BEMHTML
• Tutorial on i-bem.js

• SSSR (Social Services Search Robot) — study app with BEM full-stack

• BEM - Building 'em modular
• BEM for JavaScript Talk on Camp JS