add tools gif

Author: liujing

README.md

@@ -50,8 +50,11 @@ Rock是一个Express + Webpack `脚手架`。可生成简单，稳定的Node服
 4. 访问 `http://localhost:8081`
 
 ### 其他命令
-* Client Side
-	yo rock:component
+* 生成前端组件
+  
+  		yo rock:component
+
+![yo rock:component](/docs/image/rock-tools.gif?raw=true)
 
 ### 开发文档
 1. [Configuration vs. Definition](/docs/01%20Configuration%20vs.%20Definition.md)

component/index.js

@@ -107,7 +107,7 @@ module.exports = generators.Base.extend({
         }
 
         if (needJs) {
-            const className = name.slice(0, 1).toUpperCase() + name.slice(1);
+            const className = name.split('-').map((item) => item.slice(0, 1).toUpperCase() + item.slice(1)).join('');
             switch(type) {
                 case 'react':
                     this.fs.copyTpl(

component/templates/pageTemplate.ejs

@@ -1,7 +1,7 @@
 <% layout('common/layout') -%>
-<% block('head').append(`<link type="text/css" href="${assetsConfig.<?= name ?>.css}" rel="stylesheet" charset="utf-8">`) %>
+<% block('head').append(`<link type="text/css" href="${assetsConfig['<?= name ?>'].css}" rel="stylesheet" charset="utf-8">`) %>
 
 <h2>当前页面是 <?= name ?></h2><? if (type === 'vue' || type === 'react') { ?>
 <div id="app"></div><? } ?>
 
-<% block('footer').append(`<script src="${assetsConfig.<?= name ?>.js}"></script>`) %>
+<% block('footer').append(`<script src="${assetsConfig['<?= name ?>'].js}"></script>`) %>