docs: 更新文档

This commit is contained in:
bac-joker 2021-03-06 15:22:09 +08:00
parent 81302d5e42
commit fe121ab542
10 changed files with 41 additions and 23 deletions

1
.gitignore vendored
View File

@ -5,6 +5,7 @@
.history .history
.cache .cache
.temp .temp
dist
*.log *.log
node_modules node_modules
npm-debug.log npm-debug.log

View File

@ -3,11 +3,11 @@ import type { DefaultThemeOptions } from '@vuepress/theme-default'
import { navbar, sidebar } from './configs' import { navbar, sidebar } from './configs'
const config: UserConfig<DefaultThemeOptions> = { const config: UserConfig<DefaultThemeOptions> = {
base: '/', base: '/fesjs/',
evergreen: process.env.NODE_ENV !== 'production', evergreen: process.env.NODE_ENV !== 'production',
head: [['link', { rel: 'manifest', href: '/manifest.webmanifest' }], ['link', { rel: 'icon', href: `/logo.png` }]], head: [['link', { rel: 'manifest', href: '/fesjs/manifest.webmanifest' }], ['link', { rel: 'icon', href: `/fesjs/logo.png` }]],
// site-level locales config // site-level locales config
locales: { locales: {

View File

@ -36,13 +36,14 @@ Fes.js 是一个好用的前端应用解决方案。Fes.js 以 Vue 3.0 和路由
## Fes.js 如何工作? ## Fes.js 如何工作?
### 架构 ### 架构
![架构](/framework.png "架构") <!-- ![架构](/framework.png "架构") -->
<img :src="$withBase('framework.png')" alt="架构">
Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。 Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。
### 插件和插件集 ### 插件和插件集
<p> <p>
<img src="/plugins.png" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image"> <img :src="$withBase('plugins.png')" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image">
</p> </p>
Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。 Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。

View File

@ -54,11 +54,13 @@ npx @fesjs/create-fes-app myapp
如果项目目录 `workspace/myapp` 已经存在,则会提示目录已存在,你可以选择 `Overwrite` 删除目录后重新创建项目,也可以选择 `Merge` 使用模板文件覆盖当前目录文件。 如果项目目录 `workspace/myapp` 已经存在,则会提示目录已存在,你可以选择 `Overwrite` 删除目录后重新创建项目,也可以选择 `Merge` 使用模板文件覆盖当前目录文件。
![目录已存在提示](/pickTemplateTip.png) <!-- ![目录已存在提示](/pickTemplateTip.png) -->
<img :src="$withBase('pickTemplateTip.png')" alt="目录已存在提示">
如果项目目录 `workspace/myapp` 不存在,你会被提示选取一个 template。你可以选默认适用于中后台前端应用的 `PC` 类型,也可以选适用于移动端的 `H5` 类型。 如果项目目录 `workspace/myapp` 不存在,你会被提示选取一个 template。你可以选默认适用于中后台前端应用的 `PC` 类型,也可以选适用于移动端的 `H5` 类型。
![选择模板类型](/pickTemplate.png) <!-- ![选择模板类型](/pickTemplate.png) -->
<img :src="$withBase('pickTemplate.png')" alt="选择模板类型">
##### 步骤3 安装依赖 ##### 步骤3 安装依赖
<CodeGroup> <CodeGroup>
@ -129,8 +131,8 @@ Starting the development server http://localhost:8080 ...
Fes.js 会在 [http://localhost:8080](http://localhost:8080) 启动一个热重载的开发服务器。当你修改你的 .vue 文件时,浏览器中的内容也会自动更新。 Fes.js 会在 [http://localhost:8080](http://localhost:8080) 启动一个热重载的开发服务器。当你修改你的 .vue 文件时,浏览器中的内容也会自动更新。
![home](/home.png) <!-- ![home](/home.png) -->
<img :src="$withBase('home.png')" alt="home">
## 部署发布 ## 部署发布

View File

@ -1,11 +1,12 @@
## 架构 ## 架构
![架构](/framework.png "架构") <!-- ![架构](/framework.png "架构") -->
<img :src="$withBase('framework.png')" alt="架构">
Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。 Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。
## 插件和插件集 ## 插件和插件集
<p> <p>
<img src="/plugins.png" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image"> <img :src="$withBase('plugins.png')" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image">
</p> </p>
Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。 Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。

View File

@ -16,11 +16,15 @@
默认是 `side` 默认是 `side`
### side ### side
![side](/side.png) <!-- ![side](/side.png) -->
<img :src="$withBase('side.png')" alt="side">
### top ### top
![top](/top.png) <!-- ![top](/top.png) -->
<img :src="$withBase('top.png')" alt="top">
### mixin ### mixin
![mixin](/mixin.png) <!-- ![mixin](/mixin.png) -->
<img :src="$withBase('mixin.png')" alt="mixin">
## 启用方式 ## 启用方式
`package.json` 中引入依赖: `package.json` 中引入依赖:

View File

@ -36,13 +36,14 @@ Fes.js 是一个好用的前端应用解决方案。Fes.js 以 Vue 3.0 和路由
## Fes.js 如何工作? ## Fes.js 如何工作?
### 架构 ### 架构
![架构](/framework.png "架构") <!-- ![架构](/framework.png "架构") -->
<img :src="$withBase('framework.png')" alt="架构">
Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。 Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。
### 插件和插件集 ### 插件和插件集
<p> <p>
<img src="/plugins.png" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image"> <img :src="$withBase('plugins.png')" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image">
</p> </p>
Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。 Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。

View File

@ -54,11 +54,13 @@ npx @fesjs/create-fes-app myapp
如果项目目录 `workspace/myapp` 已经存在,则会提示目录已存在,你可以选择 `Overwrite` 删除目录后重新创建项目,也可以选择 `Merge` 使用模板文件覆盖当前目录文件。 如果项目目录 `workspace/myapp` 已经存在,则会提示目录已存在,你可以选择 `Overwrite` 删除目录后重新创建项目,也可以选择 `Merge` 使用模板文件覆盖当前目录文件。
![目录已存在提示](/pickTemplateTip.png) <!-- ![目录已存在提示](/pickTemplateTip.png) -->
<img :src="$withBase('pickTemplateTip.png')" alt="目录已存在提示">
如果项目目录 `workspace/myapp` 不存在,你会被提示选取一个 template。你可以选默认适用于中后台前端应用的 `PC` 类型,也可以选适用于移动端的 `H5` 类型。 如果项目目录 `workspace/myapp` 不存在,你会被提示选取一个 template。你可以选默认适用于中后台前端应用的 `PC` 类型,也可以选适用于移动端的 `H5` 类型。
![选择模板类型](/pickTemplate.png) <!-- ![选择模板类型](/pickTemplate.png) -->
<img :src="$withBase('pickTemplate.png')" alt="选择模板类型">
##### 步骤3 安装依赖 ##### 步骤3 安装依赖
<CodeGroup> <CodeGroup>
@ -129,7 +131,8 @@ Starting the development server http://localhost:8080 ...
Fes.js 会在 [http://localhost:8080](http://localhost:8080) 启动一个热重载的开发服务器。当你修改你的 .vue 文件时,浏览器中的内容也会自动更新。 Fes.js 会在 [http://localhost:8080](http://localhost:8080) 启动一个热重载的开发服务器。当你修改你的 .vue 文件时,浏览器中的内容也会自动更新。
![home](/home.png) <!-- ![home](/home.png) -->
<img :src="$withBase('home.png')" alt="home">
## 部署发布 ## 部署发布

View File

@ -1,11 +1,12 @@
## 架构 ## 架构
![架构](/framework.png "架构") <!-- ![架构](/framework.png "架构") -->
<img :src="$withBase('framework.png')" alt="架构">
Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。 Fes.js 把大家常用的技术栈封装成一个个插件进行整理,收敛到一起,让大家只用 Fes.js 就可以完成 80% 的日常工作。
## 插件和插件集 ## 插件和插件集
<p> <p>
<img src="/plugins.png" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image"> <img :src="$withBase('plugins.png')" alt="插件" title="插件" style="width: 500px" class="medium-zoom-image">
</p> </p>
Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。 Fes.js 支持插件和插件集,通过这张图应该很好理解到他们的关系,通过插件集我们把插件收敛依赖然后支持不同的业务类型。

View File

@ -16,11 +16,15 @@
默认是 `side` 默认是 `side`
### side ### side
![side](/side.png) <!-- ![side](/side.png) -->
<img :src="$withBase('side.png')" alt="side">
### top ### top
![top](/top.png) <!-- ![top](/top.png) -->
<img :src="$withBase('top.png')" alt="top">
### mixin ### mixin
![mixin](/mixin.png) <!-- ![mixin](/mixin.png) -->
<img :src="$withBase('mixin.png')" alt="mixin">
## 启用方式 ## 启用方式
`package.json` 中引入依赖: `package.json` 中引入依赖: