docs: up advice and add screenshot (#7)

docs: up advice and add screenshot

README.md

@@ -18,9 +18,9 @@
 
 </div>
 
-**Live demo one:** [https://vue-iview-admin-temp.ywbang.icu](https://vue-iview-admin-temp.ywbang.icu) 
+**Live demo one:** [https://vue-iview-admin-template.ywbang.icu](https://vue-iview-admin-template.ywbang.icu)
 
-**Live demo two:** [https://vue-iview-admin-template.ywbang.icu](https://vue-iview-admin-template.ywbang.icu)
+**Live demo two:** [https://vue-iview-admin-temp.ywbang.icu](https://vue-iview-admin-temp.ywbang.icu) 
 
 ## Usage
 
@@ -44,16 +44,18 @@ npm run build:r
 npm run lint
 ```
 
-## Demo
+## Screenshot
 
-- 待续
+|                                        |                                        |                                        |
+| -------------------------------------- | -------------------------------------- | -------------------------------------- |
+| ![](./docs/_media/20200819-091956.png) | ![](./docs/_media/20200819-092352.png) | ![](./docs/_media/20200819-092201.png) |
+| ![](./docs/_media/20200819-092217.png) | ![](./docs/_media/20200819-092320.png) | ![](./docs/_media/20200819-092416.png) |
 
 ## Links
 
-- [Live demo one](https://vue-iview-admin-temp.ywbang.icu)
-- [Live demo two](https://vue-iview-admin-template.ywbang.icu)
+- [Live demo one](https://vue-iview-admin-template.ywbang.icu)
+- [Live demo two](https://vue-iview-admin-temp.ywbang.icu)
 - [Documentation](https://liuvigongzuoshi.github.io/vue-iview-admin-template/)
-- 待续
 
 ## Browsers support
 

docs/README.md

@@ -18,9 +18,9 @@
 
 </div>
 
-**Live demo one:** [https://vue-iview-admin-temp.ywbang.icu](https://vue-iview-admin-temp.ywbang.icu) 
+**Live demo one:** [https://vue-iview-admin-template.ywbang.icu](https://vue-iview-admin-template.ywbang.icu)
 
-**Live demo two:** [https://vue-iview-admin-template.ywbang.icu](https://vue-iview-admin-template.ywbang.icu)
+**Live demo two:** [https://vue-iview-admin-temp.ywbang.icu](https://vue-iview-admin-temp.ywbang.icu) 
 
 ## Usage
 
@@ -44,16 +44,18 @@ npm run build:r
 npm run lint
 ```
 
-## Demo
+## Screenshot
 
-- 待续
+|                                   |                                   |                                   |
+| --------------------------------- | --------------------------------- | --------------------------------- |
+| ![](./_media/20200819-091956.png) | ![](./_media/20200819-092352.png) | ![](./_media/20200819-092201.png) |
+| ![](./_media/20200819-092217.png) | ![](./_media/20200819-092320.png) | ![](./_media/20200819-092416.png) |
 
 ## Links
 
-- [Live demo one](https://vue-iview-admin-temp.ywbang.icu)
-- [Live demo two](https://vue-iview-admin-template.ywbang.icu)
+- [Live demo one](https://vue-iview-admin-template.ywbang.icu)
+- [Live demo two](https://vue-iview-admin-temp.ywbang.icu)
 - [Documentation](https://liuvigongzuoshi.github.io/vue-iview-admin-template/)
-- 待续
 
 ## Browsers support
 

docs/advice/construct.md

@@ -111,9 +111,17 @@ module.exports = {
 
 - `plugins: []`：在 ESLint 中加载插件，插件可用于配置校验规则。
 
-- `extends: [ ... ]`：在 ESLint 中使用[共享规则配置](https://cn.eslint.org/docs/developer-guide/shareable-configs)，其中 `eslint:recommended` 是 ESLint 内置的推荐校验规则配置（也被称作最佳规则实践）。`plugin:vue/essential` 是 Vue 官方推荐必须的校验 vue 语法规则配置，其依赖包为`eslint-plugin-vue`。`@vue/prettier`  是基于 Prettier 封装的代码格式规则，其依赖包为 `@vue/eslint-config-prettier`。
+- `extends: [ ... ]`：在 ESLint 中使用[共享规则配置](https://cn.eslint.org/docs/developer-guide/shareable-configs)
+  - 其中 `eslint:recommended` 是 ESLint 内置的推荐校验规则配置（也被称作最佳规则实践）。`plugin:vue/essential` 是 Vue 官方推荐必须的校验 vue 语法规则配置，其依赖包为`eslint-plugin-vue`。`@vue/prettier`  是基于 Prettier 封装的代码格式规则，其依赖包为 `@vue/eslint-config-prettier`。
+  - `extends` 除了可以引入推荐规则，还可以以文件形式引入其它的自定义规则，然后在这些自定义规则的基础上用`rules` 去定义个别规则，从而覆盖掉 `extends` 中引入的规则。
 
-- `rules: {}`：覆写某个校验规则配置。
+- `rules: {}`：覆写某个校验规则配置，规则有三种级别
+  - `off` 或者 `0`，不启用这个规则
+  - `warn` 或者 `1`，出现问题会有警告
+  - `error` 或者 `2`，出现问题会报错
+
+
+- `env: {}`: 通过 `env` 配置需要启动的环境
 
 在 package.json 中添加校验命令
 
@@ -135,7 +143,7 @@ module.exports = {
 
 #### ESLint 确保代码上传
 
-ESLint 中的质量规则校验与预防错误是无法通过自动进行格式化修复的，因此还需要一层保障能够确保代码提交之前所有的代码能够通过 ESLint 校验，这个功能将使用`Lint Staged`，具体配置查看 [Lint Staged](###Lint Staged)。
+ESLint 中的质量规则校验与预防错误是无法通过自动进行格式化修复的，因此还需要一层保障能够确保代码提交之前所有的代码能够通过 ESLint 校验，这个功能将使用`Lint Staged`，具体配置查看 [Lint Staged](### Lint Staged)。
 
 ### Prettier
 
@@ -150,7 +158,7 @@ ESLint 的规则校验同时包含了**格式规则**和**质量规则**，但
 
 #### Prettier 配置
 
-在 ESLint 配置中已经集成脚手架封装 `@vue/prettier`规则包了，需要说明的是脚手架集成 prettier 中会安装配置 `eslint-config-prettier`，其 [eslint-config-prettier](https://github.com/prettier/eslint-config-prettier) 用于解决 ESLint 和 Prettier 配合使用时容易产生的**格式规则**冲突问题，其作用就是关闭 ESLint 中配置的一些格式规则，除此之外还包括关闭 `eslint-plugin-babel`、`eslint-plugin-vue`、`eslint-plugin-standard` 等格式规则。
+在 ESLint 配置中已经集成脚手架封装 `@vue/prettier` 规则包了，需要说明的是脚手架集成 prettier 中会安装配置 `eslint-plugin-prettier` 与 `eslint-config-prettier`，其 [eslint-config-prettier](https://github.com/prettier/eslint-config-prettier) 用于解决 ESLint 和 Prettier 配合使用时容易产生的**格式规则**冲突问题，其作用就是关闭 ESLint 中配置的一些格式规则，除此之外还包括关闭 `eslint-plugin-babel`、`eslint-plugin-vue`、`eslint-plugin-standard` 等格式规则。而 `eslint-config-prettier` 模块实际是为 [`eslint-plugin-prettier`](https://github.com/prettier/eslint-plugin-prettier) 插件服务的，在 `eslint-plugin-prettier` 的源码中调用了 `eslint-config-prettier` 中相关的配置，然后执行插件中的代码。
 
 Prettier的格式规则，可通过 `.prettierrc` 文件进行配置，未配置的情况下使用官方默认的格式规则。