feat(@vben/docs): support english documents (#4202)

* chore(@vben/docs): 完成guide文档的翻译

* chore(@vben/docs): 完成other文档的翻译

* chore: 翻译部分文档

* chore: 完成英文config的配置

* chore: 完成in-depth的文档翻译

* chore: 调整调整链接

* chore: typo

* chore: typo

* chore: update links

---------

Co-authored-by: Li Kui <90845831+likui628@users.noreply.github.com>
This commit is contained in:
invalid w
2024-08-23 19:46:51 +08:00
committed by GitHub
parent c27b97f933
commit 8230493651
42 changed files with 5795 additions and 315 deletions

View File

@@ -0,0 +1,152 @@
# Frequently Asked Questions #{faq}
::: tip Listed are some common questions
If you have a question, you can first look here. If not found, you can search or submit your question on [GitHub Issue](https://github.com/vbenjs/vue-vben-admin/issues), or if it's a discussion-type question, you can go to [GitHub Discussions](https://github.com/vbenjs/vue-vben-admin/discussions)
:::
## Instructions
If you encounter a problem, you can start looking from the following aspects:
1. Search the corresponding module's GitHub repository [issue](https://github.com/vbenjs/vue-vben-admin/issues)
2. Search for the problem on [Google](https://www.google.com)
3. Search for the problem on [Baidu](https://www.baidu.com)
4. If you can't find the issue in the list below, you can ask in [issues](https://github.com/vbenjs/vue-vben-admin/issues)
5. If it's not a problem type and needs discussion, please go to [discussions](https://github.com/vbenjs/vue-vben-admin/discussions) to discuss
## Dependency Issues
In a `Monorepo` project, it is necessary to develop the habit of executing `pnpm install` every time you `git pull` the code, as new dependency packages are often added. The project has already configured automatic execution of `pnpm install` in `.husky/git-merge`, but sometimes there might be issues. If it does not execute automatically, it is recommended to execute it manually once.
## About Cache Update Issues
The project configuration is by default cached in `localStorage`, so some configurations may not change after a version update.
The solution is to modify the `version` number in `package.json` each time the code is updated. This is because the key for `localStorage` is based on the version number. Therefore, after an update, the configurations from a previous version will become invalid. Simply re-login to apply the new settings.
## About Modifying Configuration Files
When modifying environment files such as `.env` or the `vite.config.ts` file, Vite will automatically restart the service.
There's a chance that automatic restarts may encounter issues. Simply rerunning the project can resolve these problems.
## Errors When Running Locally
Since Vite does not transform code locally and the code uses relatively new syntax such as optional chaining, local development requires using a higher version of the browser (`Chrome 90+`).
## Blank Page After Switching Pages
This issue occurs because route switching animations are enabled, and the corresponding page component has multiple root nodes. Adding a `<div></div>` at the outermost layer of the page can solve this problem.
**Incorrect Example**
```vue
<template>
<!-- Annotations are also considered a node -->
<h1>text h1</h1>
<h2>text h2</h2>
</template>
```
**正确示例**
```vue
<template>
<div>
<h1>text h1</h1>
<h2>text h2</h2>
</div>
</template>
```
::: tip Tip
- If you want to use multiple root tags, you can disable route switching animations.
- Root comment nodes under `template` are also counted as a node.
:::
## My code works locally but not when packaged
The reason for this issue could be one of the following. You can check these reasons, and if there are other possibilities, feel free to add them:
- The variable `ctx` was used, which is not exposed in the instance type. The Vue official documentation also advises against using this property as it is intended for internal use only.
```ts
import { getCurrentInstance } from 'vue';
getCurrentInstance().ctx.xxxx;
```
## Dependency Installation Issues
- If you cannot install dependencies or the startup reports an error, you can try executing `pnpm run reinstall`.
- If you cannot install dependencies or encounter errors, you can try switching to a mobile hotspot for installing dependencies.
- If that still doesn't work, you can configure a domestic mirror for installation.
- You can also create a `.npmrc` file in the project root directory with the following content:
```bash
# .npmrc
registry = https://registry.npmmirror.com/
```
## Package File Too Large
- First, the full version will be larger because it includes many library files. You can use the simplified version for development.
- Secondly, it is recommended to enable gzip, which can reduce the size to about 1/3 of the original. Gzip can be enabled directly by the server. If so, the frontend does not need to build `.gz` format files. If the frontend has built `.gz` files, for example, with nginx, you need to enable the `gzip_static: on` option.
- While enabling gzip, you can also enable `brotli` for better compression than gzip. Both can coexist.
**Note**
- gzip_static: This module requires additional installation in nginx, as the default nginx does not include this module.
- Enabling `brotli` also requires additional nginx module installation.
## Runtime Errors
If you encounter errors similar to the following, please check that the full project path (including all parent paths) does not contain Chinese, Japanese, or Korean characters. Otherwise, you will encounter a 404 error for the path, leading to the following issue:
```ts
[vite] Failed to resolve module import "ant-design-vue/dist/antd.css-vben-adminode_modulesant-design-vuedistantd.css". (imported by /@/setup/ant-design-vue/index.ts)
```
## Console Route Warning Issue
If you see the following warning in the console, and the page `can open normally`, you can ignore this warning.
Future versions of `vue-router` may provide an option to disable this warning.
```ts
[Vue Router warn]: No match found for location with path "xxxx"
```
## Startup Error
If you encounter the following error message, please check if your nodejs version meets the requirements.
```bash
TypeError: str.matchAll is not a function
at Object.extractor (vue-vben-admin-main\node_modules@purge-icons\core\dist\index.js:146:27)
at Extract (vue-vben-admin-main\node_modules@purge-icons\core\dist\index.js:173:54)
```
## nginx Deployment
After deploying to `nginx`you might encounter the following error:
```bash
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "application/octet-stream". Strict MIME type checking is enforced for module scripts per HTML spec.
```
Solution:
```bash
http {
types {
application/javascript js mjs;
}
}
```

View File

@@ -0,0 +1,54 @@
# PROJECT UPDATE
## Why Can't It Be Updated Like a npm Plugin
Because the project is a complete project template, not a plugin or a package, it cannot be updated like a plugin. After you use the code, you will develop it further based on business needs, and you need to manually merge and upgrade.
## What Should I Do
The project is managed using a `Monorepo` approach and has abstracted some of the more core code, such as `packages/@core`, `packages/effects`. As long as the business code has not modified this part of the code, you can directly pull the latest code and then merge it into your branch. You only need to handle some conflicts simply. Other folders will only make some minor adjustments, which will not affect the business code.
::: tip Recommendation
It is recommended to follow the repository updates actively and merge them; do not accumulate over a long time, Otherwise, it will lead to too many merge conflicts and increase the difficulty of merging.
:::
## Updating Code Using Git
1. Clone the code
```bash
git clone https://github.com/vbenjs/vue-vben-admin.git
```
2. Add your company's git source address
```bash
# up is the source name, can be set arbitrarily
# gitUrl is the latest open-source code
git remote add up gitUrl;
```
3. Push the code to your company's git
```bash
# Push the code to your company
# main is the branch name, adjust according to your situation
git push up main
# Sync the company's code
# main is the branch name, adjust according to your situation
git pull up main
```
4. How to sync the latest open-source code
```bash
git pull origin main
```
::: tip Tip
When syncing the code, conflicts may occur. Just resolve the conflicts.
:::

View File

@@ -0,0 +1,18 @@
# Remove Code
## Remove Code
In the corresponding application's `index.html` file, find the following code and delete it:
```html
<!-- apps/web-antd -->
<script>
var _hmt = _hmt || [];
(function () {
var hm = document.createElement('script');
hm.src = 'https://hm.baidu.com/hm.js?d20a01273820422b6aa2ee41b6c9414d';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
```