node package manager
It’s your turn. Help us improve JavaScript. Take the 2017 JavaScript Ecosystem Survey »



< Back to Project WebCube

NPM Version


iOS Safari Android WebView IE
iOS 7+ ✔ Android 4+ ✔ 11+ ✔

webcube is a continuously updated JS infrastructure for modern Universal JS web app/site and static web.

It is part of my effort to simplify the usage of all 'mainstream' tools and best practices mentioned in the Spellbook of Modern Web Dev.

It can automatically provides the modern software engineering environment, architecture, workflow and best practices. It also can lower the barrier of starting a new web app project.

Get Started

Usage #1: create a web project as a standalone repo

Step 0:

Copy webcube-starter-for-standalone-repo/package.json into your repo

mkdir my-project
cd my-project && curl > package.json

Step 1:

Install dependencies

git init
npm run update

Step 2:


npm run webcube:setup

Step 3:

Create an entry point

npm run new

Usage #2: create a web project in a monorepo


Create a monorepo based on webcube's monorepo

git clone your-monorepo
cd your-monorepo/
rm -rf .git examples starters
mkdir entries
mkdir services
git init

NOTE: If you need not to fork webcube's packages, you should remove these files:

rm -rf packages/*

Step 0:

Create your project as a monorepo workspace directory

mkdir -p entries/my-project

Copy webcube-starter-for-project-in-monorepo/package.json into your project

cd entries/my-project && curl > package.json

Edit entries/my-project/package.json, replace fields surrounded by angle brackets with correct configuration.

Step #1:

Install dependencies in monorepo's root

cd ../../
npm run update
cd -

Step 2:


npm run webcube:setup

Step 3:

Create entry point

npm run new

How To Develop

For faster recompiling (webpack-dev-server):

npm run dev


npm run dev:dashboard

Enable automatically refreshing:

LIVE_MODE=refresh npm run dev:dashboard

Enable HMR (Hot Module Replacement):

LIVE_MODE=hmr npm run dev:dashboard

How To Test (WIP)

How To Deploy

Static Web Mode

NOTE: for static cloud environment (e.g. AWS S3, Aliyun OSS, Cloudflare, ...)

npm run deploy:staticweb

For staging environment:

npm run deploy:staging:staticweb

Environment variables: WEBCUBE_DEPLOY_STATIC_*

For example,


Static Server Mode

npm run deploy:staticserver

Server-side Rendering Mode (WIP)

Packaged App Mode (WIP)


Features (WIP)

Philosophy (WIP)

Slides (in Chinese) @ JSConf CN 2017