renrenche / rock

Rock

Rock is a Javascript fullstack generator equipped with following techs: Express, Ejs, Webpack and Gulp. You can choose React, Vue, or jQuery for client frameworks as you wish because webpack configuration has been ready for that.

Rock是一个Express + Webpack 脚手架。可生成简单，稳定的Node服务。

提供了基础的 Server架构，详尽的 Webpack配置，最佳实践，使用者可自由选择前端框架如 React, Vue。

上手简单，文档详尽，开发者友好。

演示

支持配置

• Build Systems
  • Webpack (main)
  • Gulp
• Testing
  • Mocha, Chai, Sinon
• Client
  • Scripts: Javascript (Babel)
  • Module Systems: Webpack
  • Markup: EJS
  • Stylesheets: CSS, Less
  • Static-Files-Server: Webpack-dev-server
• Server
  • Scripts: Javascript (no Babel)
  • Framework: Express
• Development
  • Lint: Eslint
  • Debugger: Source-map
  • Auto-Refresh: Nodemon, Livereload
• Production
  • Log: Winston, Morgan
  • Optimize: UglifyJsPlugin, cssnano
  • Compatibility: Autoprefixer

使用方式

1. 安装 yo 和 rock

    npm install -g yo generator-rock
   

2. 使用rock生成一个项目

    yo rock
   

3. 启动服务

    npm run dev
   

4. 访问 http://localhost:8081

其他命令

• 生成前端组件

    yo rock:component
  

开发文档

1. Configuration vs. Definition
2. Directory
3. Client Module System
4. Webpack Configuration
5. Effective Ops
6. Tests
7. Let's Rock

项目示例

├── client
│   ├── common
│   │   ├── index.js
│   │   ├── libs
│   │   │   ├── jquery.js
│   │   │   ├── log.js
│   │   │   └── require.js
│   │   └── style.less
│   └── index
│       ├── index.js
│       └── style.less
├── config
│   ├── default.js
│   ├── development.js
│   └── production.js
├── gulpfile.js
├── index.js
├── package.json
├── scripts
│   ├── build
│   │   ├── jenkins.sh
│   │   └── release.sh
│   ├── crontab.sh
│   ├── deploy
│   │   ├── production.sh
│   │   └── test.sh
│   ├── deploy.sh
│   ├── process.production.json
│   └── test
│       ├── coverage.sh
│       └── unit.sh
├── server
│   ├── controllers
│   │   └── index.js
│   ├── server.js
│   └── views
│       ├── index.ejs
│       └── layout.ejs
├── webpack
│   ├── development.config.js
│   ├── production.config.js
│   └── webpack-dev-server.js
└── webpack-assets.json

Dependencies

• express: Fast, unopinionated, minimalist web framework
• ejs-mate: Express 4.x locals for layout, partial.
• morgan: HTTP request logger middleware for node.js
• winston: A multi-transport async logging library for Node.js

Dev Dependencies

• babel: Turn ES6 code into readable vanilla ES5 with source maps
• eslint: An AST-based pattern checker for JavaScript.
• chai: BDD/TDD assertion library for node.js and the browser. Test framework agnostic.
• mocha: simple, flexible, fun test framework
• less: Leaner CSS
• gulp: The streaming build system
• webpack: Packs CommonJs/AMD modules for the browser. Allows to split your codebase into multiple bundles, which can be loaded on demand. Support loaders to preprocess files, i.e. json, jade, coffee, css, less, ... and your custom stuff.
• webpack-dev-server: Serves a webpack app. Updates the browser on changes.

Thanks

• [email protected]
• [email protected]
• [email protected]
• [email protected]