upgrade webpack v1 to v4

.gitignore

@@ -5,4 +5,5 @@ npm-debug.log
 selenium-debug.log
 test/unit/coverage
 test/e2e/reports
-source/assets/
+source/assets/
+package-lock.json

README.md

@@ -1,82 +1,39 @@
 hexo-theme-yilia
 ================
 
-Yilia 是为 [hexo](https://github.com/tommy351/hexo) 2.4+制作的主题。
-崇尚简约优雅，以及极致的性能。 你可以点击 [我的博客](http://litten.me/) 查看效果。           
-
-如果想体验手机浏览效果，可以扫一下二维码：
+本主题Fork自从[litten/hexo-theme-yilia](https://github.com/litten/hexo-theme-yilia), 只是出于学习对原主题进行略微修改调整，不用于任何商业用途。请大家支持原作者[litten](https://github.com/litten)的博客和主题。
 
-![litten-qrcode](https://cloud.githubusercontent.com/assets/2024949/6349328/51a067fe-bc64-11e4-881c-f68050c50c28.png)
+若喜欢我的修改也可以一起学习研究，在[Issue](https://github.com/jardenliu/hexo-theme-yilia/issues)提交问题喔。
 
-—————————————————————
 
-**关于主题：**
 
-1. 崇尚简约       
-2. 追求移动端体验     
-3. 希望把加载速度做到极致（努力中）    
-4. 让大家把注意力放到内容上。这是本主题设计初衷      
-5. 主题不支持IE6，7，8。以后也不会     
-
-**近期更新（2017.07.09）：**
-
-2017.07.09
-1. 返回顶部
-2. TOC目录
-
-2016.12.04
-1. 打赏
-2. 搜索
-3. “更好的”标签云
-4. “更好的”分享
-5. 一些动画
-
-**计划中：**
-
-1. 移动端优化
-
-## 一、外观
-
-####**常规**
-
-![常规](https://cloud.githubusercontent.com/assets/2024949/19027861/92879edc-8967-11e6-8e60-7987b6507c8d.gif)
-
-####**手机**
-
-![手机](https://cloud.githubusercontent.com/assets/2024949/19027020/1c5b756a-895f-11e6-99bf-ddff9687aee0.gif)   
-
-####**ipad横竖屏切换**
-
-![ipad横竖屏切换](https://cloud.githubusercontent.com/assets/2024949/19026392/e74e1816-8957-11e6-8f08-eac9b3c8c036.gif)                    
-
-## 二、开发者
-
-为了性能和开发工程化考虑，Yilia需要使用webpack进行构建生成。
-
-如果您对主题有一些定制化的需求，请参考wiki[《Yilia源码目录结构及构建须知》](https://github.com/litten/hexo-theme-yilia/wiki/Yilia%E6%BA%90%E7%A0%81%E7%9B%AE%E5%BD%95%E7%BB%93%E6%9E%84%E5%8F%8A%E6%9E%84%E5%BB%BA%E9%A1%BB%E7%9F%A5)
-
-## 三、使用
-
-#### 安装
-
-``` bash
-$ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
+## 用法
+1. 在hexo博客项目主目录下, 安装本主题. (后续会提供 npm 版本，敬请关注)
+```bash
+  ## 已用 hexo init 博客 以及 npm install
+  cd <path to your blog>
+  git submodule add https://github.com/jardenliu/hexo-theme-yilia.git yilia
+  node ./yilia/install.js  ##如果你有安装cnpm， 可以使用 node ./yilia/install.js --cnpm
 ```
+2. 修改`_config.yml`的配置项 `theme`.
+```
+  theme: yilia
+```
+3. 启动`webpack dev`以及`hexo server`
+```
+  npm run dev --prefix yilia
+```
+4. 修改 `_config.yml` 以及 `yilia_config.yml`，打开浏览器，`http://localhost:4000/`, 开始你的hexo 之旅吧。
 
-#### 配置
 
-修改hexo根目录下的 `_config.yml` ： `theme: yilia`
+## 主题介绍
 
-#### 更新
+点击右侧→ [传送门](https://github.com/litten/hexo-theme-yilia) 前往
 
-``` bash
-cd themes/yilia
-git pull
-```
 
-## 四、配置
 
-主题配置文件在主目录下的`_config.yml`，请根据自己需要修改使用。
+## `yilia_config.yml`配置
+主题配置文件在项目主目录下的 `yilia_config.yml` (注意`不是themes/yilia/_config.yml`) 请根据自己需要修改使用。
 完整配置例子，可以参考[我的博客备份](https://github.com/litten/BlogBackup)
 
 ```

_config.yml

@@ -2,7 +2,8 @@
 
 menu:
   主页: /
-  随笔: /tags/随笔/
+  标签: /tags/
+  分类: /categories/
 
 # SubNav
 subnav:
@@ -101,6 +102,8 @@ gitment_oauth:
 style:
   # 头像上面的背景颜色
   header: '#4d4d4d'
+  # 头像上面的背景图片
+  headerBg: 
   # 右滑板块背景
   slider: 'linear-gradient(200deg,#a0cfe4,#e8c37e)'
 
@@ -127,4 +130,13 @@ friends:
   友情链接5: http://localhost:4000/
   友情链接6: http://localhost:4000/
 
-aboutme: 很惭愧<br><br>只做了一点微小的工作<br>谢谢大家
+aboutme: 很惭愧<br><br>只做了一点微小的工作<br>谢谢大家
+
+#备案号
+recordNum: '粤ICP备xxxxx号'
+
+#微信分享图片
+#hexo new page wechat
+# 在 source/wechat/index.md 中添加 type: "wechat"
+#s上面的subnav: wechat 设置为 '/wechat'
+wechatQRcode: https://gitee.com/yeliujun/gallery/raw/master/wechat-qrcode.jpg

install.js

@@ -0,0 +1,46 @@
+const {
+  spawn
+} = require('child_process');
+const fs = require('fs');
+const path = require('path');
+
+let arguments = (process.argv && process.argv.length > 2) ? process.argv.splice(2) : [];
+let isCnpmInstall = false;
+
+arguments.forEach(arg => isCnpmInstall = !!(arg.toLowerCase().match('cnpm')));
+
+// init `yilia_config.yml` in root dir,
+if (!fs.existsSync(path.resolve(__dirname, '..', 'yilia_config.yml'))) {
+  let theme_config = fs.readFileSync(path.resolve(__dirname, '_config.yml'));
+  fs.writeFileSync(path.resolve(__dirname, '..', 'yilia_config.yml'), theme_config);
+  // node v8.5+ fs.copyFileSync(path.resolve(__dirname, '_config.yml'), path.resolve(__dirname, '..', 'yilia_config.yml'));
+}
+
+let nodeModulesMsg = isCnpmInstall ? 'cnpm' : 'npm';
+
+let installDcy = spawn(nodeModulesMsg, ['install'], {
+  shell: true,
+  cwd: path.resolve(__dirname),
+  detached: true
+});
+
+installDcy.stdout.on('data', (data) => {
+  console.log(data.toString());
+});
+
+installDcy.stderr.on('data', (data) => {
+  console.log(data.toString());
+});
+
+installDcy.on('exit', (code) => {
+  // console.log(`install exit with code: ${code}`);
+  if (code == 0) {
+    console.log(`Install success !`);
+    console.log(`Set  'theme: yilia' in the _config.yml`);
+    console.log(`And the run ' npm --prefix yilia run dev ' to start it`);
+    console.log(`Enjoy ~~~`);
+  } else {
+    console.log(`Install error !`);
+    console.log(`Maybe someting wrong...`);
+  }
+});

layout/_partial/categories-page.ejs

@@ -0,0 +1,46 @@
+<section class="archives-wrap">
+  <div class="archive-year-wrap">
+    <a href="#" class="archive-year">全部分类</a>
+  </div>
+  <div class="archives">
+    <article class="archive-article archive-type-category">
+      <div class="archive-article-inner">
+        <header class="archive-article-header">
+          <div class="article-info">
+            <div class="article-category tagcloud">
+              <ul class="article-tag-list">
+                <% site.categories.each(function(tag, i) { %> 
+                  <li class="article-tag-list-item">
+                    <a href="<%= config.root %><%= tag.path %>/" class="article-tag-list-link color<%= tag.name.length % 5 + 1 %>"><%- tag.name %></a>
+                  </li>
+                <% }) %>
+              </ul>
+            </div>
+          </div>
+        </header>
+      </div>
+    </article>
+  </div>
+</section>
+<% site.categories.each(function (category) { %>
+  <section class="archives-wrap">
+    <div class="archive-year-wrap">
+      <a href="<%- url_for(category.path) %>" class="archive-year"><%= category.name %></a>
+    </div>
+    <div class="archives">
+      <% var i = 0 %>
+      <% site.posts.each(function (post) { %>
+        <% var belong = false; %>
+        <% post.categories.each(function (c) { %>
+          <% if (c.name == category.name) { %>
+            <% belong = true; %>
+          <% } %>
+        <% }) %>
+        <% if (belong) { %>
+          <% i = i+1 %>
+          <%- partial('_partial/archive-post', {post: post, even: i % 2 == 0, index: true}) %>
+        <% } %>
+      <% }) %>
+    </div>
+  </section>
+<% }) %>

layout/_partial/footer.ejs

@@ -7,6 +7,10 @@
       	<div class="footer-right">
       		<a href="http://hexo.io/" target="_blank">Hexo</a>  Theme <a href="https://github.com/litten/hexo-theme-yilia" target="_blank">Yilia</a> by Litten
       	</div>
+        <div style="clear:both"></div>
     </div>
+    <div>
+    <a  class="record-number" href='http://www.miibeian.gov.cn' target='_blank'><%= theme.recordNum ? theme.recordNum : '' %></a>
   </div>
-</footer>
+  </div>
+</footer>

layout/_partial/left-col.ejs

@@ -1,5 +1,5 @@
 <% var defaultBg = '#4d4d4d'; %>
-<div class="overlay" style="background: <%= theme.style && theme.style.header ? theme.style.header : defaultBg %>"></div>
+<div class="overlay" style="background: <%= theme.style && theme.style.header ? theme.style.header : defaultBg %>;background-size: 100% 100%;background-image: <%= theme.style && theme.style.headerBg ? 'url('+theme.style.headerBg+')' : '' %>"></div>
 <div class="intrude-less">
 	<header id="header" class="inner">
 		<a href="<%=theme.root%>" class="profilepic">
@@ -19,6 +19,7 @@
 	        <%}%>
 			</ul>
 		</nav>
+
 		<nav class="header-smart-menu">
     		<% for (var i in theme.smart_menu){ %>
     			<% if(theme.smart_menu[i]){ %>

layout/_partial/mobile-nav.ejs

@@ -1,6 +1,6 @@
 <% var defaultBg = '#4d4d4d'; %>
 <nav id="mobile-nav">
-  	<div class="overlay js-overlay" style="background: <%= theme.style && theme.style.header ? theme.style.header : defaultBg %>"></div>
+  	<div class="overlay js-overlay" style="background: <%= theme.style && theme.style.header ? theme.style.header : defaultBg %>;background-size: 100% ;background-image: <%= theme.style && theme.style.headerBg ? 'url('+theme.style.headerBg+')' : '' %>"></div>
 	<div class="btnctn js-mobile-btnctn">
   		<div class="slider-trigger list" q-on="click: openSlider(e)"><i class="icon icon-sort"></i></div>
 	</div>

layout/_partial/tags-page.ejs

@@ -0,0 +1,46 @@
+<section class="archives-wrap">
+  <div class="archive-year-wrap">
+    <a href="#" class="archive-year">全部标签</a>
+  </div>
+  <div class="archives">
+    <article class="archive-article archive-type-category">
+      <div class="archive-article-inner">
+        <header class="archive-article-header">
+          <div class="article-info">
+            <div class="article-category tagcloud">
+              <ul class="article-tag-list">
+                <% site.tags.each(function(tag, i) { %> 
+                  <li class="article-tag-list-item">
+                    <a href="<%= config.root %><%= tag.path %>/" class="article-tag-list-link color<%= tag.name.length % 5 + 1 %>"><%- tag.name %></a>
+                  </li>
+                <% }) %>
+              </ul>
+            </div>
+          </div>
+        </header>
+      </div>
+    </article>
+  </div>
+</section>
+<% site.tags.each(function (tag) { %>
+  <section class="archives-wrap">
+    <div class="archive-year-wrap">
+      <a href="<%- url_for(tag.path) %>" class="archive-year"><%= tag.name %></a>
+    </div>
+    <div class="archives">
+      <% var i = 0 %>
+      <% site.posts.each(function (post) { %>
+        <% var belong = false; %>
+        <% post.tags.each(function (c) { %>
+          <% if (c.name == tag.name) { %>
+            <% belong = true; %>
+          <% } %>
+        <% }) %>
+        <% if (belong) { %>
+          <% i = i+1 %>
+          <%- partial('_partial/archive-post', {post: post, even: i % 2 == 0, index: true}) %>
+        <% } %>
+      <% }) %>
+    </div>
+  </section>
+<% }) %>

layout/_partial/wechat.ejs

@@ -0,0 +1,24 @@
+<section class="archives-wrap">
+  <div class="archive-year-wrap">
+    <a href="#" class="archive-year">微信</a>
+  </div>
+  <div class="archives">
+    <article class="archive-article archive-type-category">
+      <div class="archive-article-inner">
+        <header class="archive-article-header">
+          <div class="article-info">
+            <div class="article-category tagcloud wehcat-subtitle">
+              使用手机微信扫描下列二维码加我微信
+            </div>
+          </div>
+        </header>
+      </div>
+
+    </article>
+  </div>
+</section>
+<section class="archives-wrap">
+  <div class="wechat-wrap">
+    <img src="<%= theme.wechatQRcode %>">
+  </div>
+</section>

layout/page.ejs

@@ -1 +1,9 @@
-<%- partial('_partial/article', {post: page, index: false}) %>
+<% if ('categories' == page.type) { %>
+  <%- partial('_partial/categories-page', {post: page, index: false}) %>
+<% } else if ('tags' == page.type) { %>
+  <%- partial('_partial/tags-page', {post: page, index: false}) %>
+<% } else if ('wechat' == page.type) { %>
+  <%- partial('_partial/wechat', {post: page, index: false}) %>
+<% } else { %>
+  <%- partial('_partial/article', {post: page, index: false}) %>
+<% } %>