From 198ac2405943b21dd53736aa1c003f61046ecf67 Mon Sep 17 00:00:00 2001 From: reco_luan Date: Wed, 25 Mar 2020 18:18:54 +0800 Subject: [PATCH] feat: multi-language(part.3) --- example/docs/.vuepress/config.js | 1 + example/docs/en/README.md | 22 +++++ .../docs/en/views/category1/2018/121501.md | 10 ++ .../docs/en/views/category1/2019/092101.md | 10 ++ example/docs/en/views/other/guide.md | 98 +++++++++++++++++++ example/docs/en/views/other/installUse.md | 26 +++++ helpers/postData.js | 5 +- package.json | 2 +- 8 files changed, 172 insertions(+), 2 deletions(-) create mode 100644 example/docs/en/README.md create mode 100644 example/docs/en/views/category1/2018/121501.md create mode 100644 example/docs/en/views/category1/2019/092101.md create mode 100644 example/docs/en/views/other/guide.md create mode 100644 example/docs/en/views/other/installUse.md diff --git a/example/docs/.vuepress/config.js b/example/docs/.vuepress/config.js index 6fd6641..82fc08d 100644 --- a/example/docs/.vuepress/config.js +++ b/example/docs/.vuepress/config.js @@ -36,6 +36,7 @@ module.exports = { text: 'Tag' // 默认 “标签” } }, + type: 'blog', logo: '/head.png', authorAvatar: '/head.png', // 搜索设置 diff --git a/example/docs/en/README.md b/example/docs/en/README.md new file mode 100644 index 0000000..32b4966 --- /dev/null +++ b/example/docs/en/README.md @@ -0,0 +1,22 @@ +--- +home: true +# heroImage: /hero.png +# heroImageStyle: { +# maxWidth: '600px', +# width: '100%', +# display: block, +# margin: '9rem auto 2rem', +# background: '#fff', +# borderRadius: '1rem', +# } +# isShowTitleInHome: false +actionText: Guide +actionLink: /views/other/guide +features: +- title: Yesterday + details: 开发一款看着开心、写着顺手的 vuepress 博客主题 +- title: Today + details: 希望帮助更多的人花更多的时间在内容创作上，而不是博客搭建上 +- title: Tomorrow + details: 希望更多的爱好者能够参与进来，帮助这个主题更好的成长 +--- \ No newline at end of file diff --git a/example/docs/en/views/category1/2018/121501.md b/example/docs/en/views/category1/2018/121501.md new file mode 100644 index 0000000..27f252a --- /dev/null +++ b/example/docs/en/views/category1/2018/121501.md @@ -0,0 +1,10 @@ +--- +title: first page in category1 +date: 2018-12-15 +tags: + - tag1 +categories: + - category1 +--- + +first page in category1 \ No newline at end of file diff --git a/example/docs/en/views/category1/2019/092101.md b/example/docs/en/views/category1/2019/092101.md new file mode 100644 index 0000000..0b063f3 --- /dev/null +++ b/example/docs/en/views/category1/2019/092101.md @@ -0,0 +1,10 @@ +--- +title: second page in category1 +date: 2019-09-21 +tags: + - tag2 +categories: + - category1 +--- + +second page in category1 \ No newline at end of file diff --git a/example/docs/en/views/other/guide.md b/example/docs/en/views/other/guide.md new file mode 100644 index 0000000..d1f6fa9 --- /dev/null +++ b/example/docs/en/views/other/guide.md @@ -0,0 +1,98 @@ +--- +title: vuepress-theme-reco +date: 2019-04-09 +categories: + - other + - test +--- + +![vuepress](https://img.shields.io/badge/vuepress-0.14.8-brightgreen.svg) +![leancloud-storage](https://img.shields.io/badge/leancloud--storage-3.10.1-orange.svg) +![valine](https://img.shields.io/badge/valine-1.3.4-blue.svg) + +|a|b| +|-|-| +|这是一个vuepress主题，旨在添加博客所需的分类、TAB墙、分页、评论等能；a|b这是一个vuepress主题，旨在添加博客所需的分类、TAB墙、分页、评论等能；| +|a|b| +|a|b| +|a|b| + +::: tip 介绍 +1. 这是一个vuepress主题，旨在添加博客所需的分类、TAB墙、分页、评论等能；
+2. 主题追求极简，根据 vuepress 的默认主题修改而成，官方的主题配置仍然适用；
+3. 你可以打开 [午后南杂](http://recoluan.gitlab.io) 来查看效果。 +::: + +::: warning 介绍 +1. 这是一个vuepress主题，旨在添加博客所需的分类、TAB墙、分页、评论等能；
+2. 主题追求极简，根据 vuepress 的默认主题修改而成，官方的主题配置仍然适用；
+3. 你可以打开 [午后南杂](http://recoluan.gitlab.io) 来查看效果。 +::: + +::: danger 介绍 +1. 这是一个vuepress主题，旨在添加博客所需的分类、TAB墙、分页、评论等能；
+2. 主题追求极简，根据 vuepress 的默认主题修改而成，官方的主题配置仍然适用；
+3. 你可以打开 [午后南杂](http://recoluan.gitlab.io) 来查看效果。 +::: + +::: theorem 牛顿第一定律 +假若施加于某物体的外力为零，则该物体的运动速度不变。 + +::: right +来自 [维基百科](https://zh.wikipedia.org/wiki/%E7%89%9B%E9%A1%BF%E8%BF%90%E5%8A%A8%E5%AE%9A%E5%BE%8B) +::: + +::: details +这是一个详情块，在 IE / Edge 中不生效 +::: + +> 测试 + +## Use + +**Build** + +```bash +npm run build + +# or + +yarn build +``` + +**Server** + +```bash +npm run dev + +# or + +yarn dev +``` + +## Play Together + +### 0.x + +`vuepress-theme-reco@0.x` 是基于 `vuepress@0.x` 的博客主题。 + +`vuepress@0.x` 功能比较简单，只适合书写简单的文档，但好在支持主题自定义，而个人又希望能够用它来书写博客，原因就是它足够的简洁，毫无疑问，这也符合很多程序员的观念，也就是在这种情况下，`vuepress-theme-reco@0.x` 的第一个版本经过一个通宵而产生。 + +主题开源不久，很多朋友通过各种联系方式，给到很多好的意见和建议，所以我个人也在积极地更新。 + +因为我是一名前端开发工程师，开发的过程中，总是想着能不能加入一些炫酷的效果，有很多次都是添加上又去掉，反反复复，最后都是被 **简洁** 的这个原则阻止掉，毕竟，现在我是将它当作一个产品来看待，并不是一个技术或者是技巧的尝试项目。 + +### 1.x + +随着不断有用户过来询问：为什么 `vuepress-theme-reco@0.x` 不能在 `vuepress@1.x` 上使用？本来只是打算对 `vuepress-theme-reco@0.x` 进行简单的bug修复的我，终究还是忍不住，开始了 `vuepress-theme-reco@1.x` 的开发。又是在一个寂静的凌晨两点半（晚上就是出活快），我默默地开始了。 + +主题升级的关键也就是 `@vuepress/plugin-blog` 这款官方插件，它不需要再去麻烦地过滤数据，将分类和标签的相关信息直接存在 `$categories` 和 `$tags` 这两个全局变量中。借助于 `@vuepress/plugin-blog`，分类和标签功能更容易实现，但也有了一些局限。接下来两三天的时间，都是在进行功能的迁移和一些bug的修复。 + +`vuepress-theme-reco@0.x` 的开发中，更加深刻地明白了模块化和组件化编程的重要性，如果当初没有把一些功能进行封装，而是直接简单的复制，这次升级也不会这么顺利。模块拆分的越细，使用就会越灵活。 + +### CLI + +还是衷心地希望能有更多的朋友参与进来，更快地去完善它。接下来时间允许的情况下，我会开源一款自动生成博客的脚手架，略过配置步骤，直接书写优质内容，这也是我后来逐渐形成的一种信念，就是希望能让这款主题，功能越完善，使用越来越简单。 + +## License +[MIT](https://github.com/recoluan/vuepress-theme-reco/blob/master/LICENSE) \ No newline at end of file diff --git a/example/docs/en/views/other/installUse.md b/example/docs/en/views/other/installUse.md new file mode 100644 index 0000000..f1bbb49 --- /dev/null +++ b/example/docs/en/views/other/installUse.md @@ -0,0 +1,26 @@ +--- +title: Installation and reference +date: 2019-04-09 11:11:11 +categories: + - other +--- + +## Install + +```bash +npm install vuepress-theme-reco -dev--save + +# or + +yarn add vuepress-theme-reco +``` + +## Usage + +```javascript +// .vuepress/config.js + +module.exports = { + theme: 'reco' +} +``` \ No newline at end of file diff --git a/helpers/postData.js b/helpers/postData.js index c1e09f2..8611918 100644 --- a/helpers/postData.js +++ b/helpers/postData.js @@ -2,6 +2,8 @@ import { compareDate } from '@theme/helpers/utils' // 过滤博客数据 export function filterPosts (posts, isTimeline, $lang) { + // 存在问题，当前函数被调用两次，第一次获取不到实例this，所以找不到 $lang，所以对这种情况做一下处理 + if ($lang === undefined) return posts posts = posts.filter((item, index) => { const { title, frontmatter: { home, date, publish, lang }} = item // 过滤多个分类时产生的重复数据 @@ -9,9 +11,10 @@ export function filterPosts (posts, isTimeline, $lang) { return false } else { const someConditions = home == true || title == undefined || publish === false || (lang !== undefined && lang !== $lang) - return isTimeline === true + const boo = isTimeline === true ? !(someConditions || date === undefined) : !someConditions + return boo } }) return posts diff --git a/package.json b/package.json index 5d53d05..cace820 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vuepress-theme-reco", - "version": "1.3.2", + "version": "1.3.3-alpha.1", "description": "A simple and beautiful vuepress Blog & Doc theme.", "main": "index.js", "scripts": {