This commit is contained in:
@@ -18,7 +18,7 @@
|
||||
|
||||
::: tip
|
||||
|
||||
因为微信群人数有限制,加微信群前,你可以通过[赞助](../sponsor/personal.md)任意金额,并备注 `加入微信群`,作者会将你拉入微信群。也可以主动发送截图给作者。
|
||||
因为微信群人数有限制,加微信群前,你可以通过[赞助](../sponsor/personal.md)任意金额,以主动发送截图给作者,备注`加入微信群`即可。
|
||||
|
||||
:::
|
||||
|
||||
|
@@ -26,7 +26,7 @@
|
||||
|
||||
在 `package.json` 中引入包:
|
||||
|
||||
```json
|
||||
```json {3}
|
||||
{
|
||||
"dependencies": {
|
||||
"@vben/utils": "workspace:*"
|
||||
@@ -46,7 +46,7 @@ import { isString } from '@vben/utils';
|
||||
|
||||
在项目中,你可以看到一些 `#` 开头的路径,例如: `#/api`、`#/views`, 这些路径都是别名,用于快速定位到某个目录。它不是通过 `vite` 的 `alias` 实现的,而是通过 `Node.js` 本身的 [subpath imports](https://nodejs.org/api/packages.html#subpath-imports) 原理。只需要在 `package.json` 中配置 `imports` 字段即可。
|
||||
|
||||
```json
|
||||
```json {3}
|
||||
{
|
||||
"imports": {
|
||||
"#/*": "./src/*"
|
||||
@@ -56,7 +56,7 @@ import { isString } from '@vben/utils';
|
||||
|
||||
为了 IDE 能够识别这些别名,我们还需要在`tsconfig.json`内配置:
|
||||
|
||||
```json
|
||||
```json {5}
|
||||
{
|
||||
"compilerOptions": {
|
||||
"baseUrl": ".",
|
||||
|
@@ -55,11 +55,9 @@ npm 脚本是项目常见的配置,用于执行一些常见的任务,比如
|
||||
// changeset 版本管理
|
||||
"changeset": "pnpm exec changeset",
|
||||
// 检查项目各种问题
|
||||
"check": "pnpm run check:dep && pnpm run check:circular && pnpm run check:type && pnpm run check:cspell",
|
||||
"check": "pnpm run check:circular && pnpm run check:dep && pnpm run check:type",,
|
||||
// 检查循环引用
|
||||
"check:circular": "vsh check-circular",
|
||||
// 检查拼写
|
||||
"check:cspell": "cspell lint \"**/*.ts\" \"**/README.md\" \".changeset/*.md\" --no-progress",
|
||||
// 检查依赖
|
||||
"check:dep": "vsh check-dep",
|
||||
// 检查类型
|
||||
|
@@ -31,7 +31,7 @@
|
||||
|
||||
```bash [.env]
|
||||
# 应用标题
|
||||
VITE_GLOB_APP_TITLE=Vben Admin
|
||||
VITE_APP_TITLE=Vben Admin
|
||||
|
||||
# 应用命名空间,用于缓存、store等功能的前缀,确保隔离
|
||||
VITE_APP_NAMESPACE=vben-web-antd
|
||||
@@ -88,7 +88,6 @@ VITE_INJECT_APP_LOADING=true
|
||||
```ts
|
||||
window._VBEN_ADMIN_PRO_APP_CONF_ = {
|
||||
VITE_GLOB_API_URL: 'https://mock-napi.vben.pro/api',
|
||||
VITE_GLOB_APP_TITLE: 'Vben Admin',
|
||||
};
|
||||
Object.freeze(window._VBEN_ADMIN_PRO_APP_CONF_);
|
||||
Object.defineProperty(window, '_VBEN_ADMIN_PRO_APP_CONF_', {
|
||||
@@ -124,13 +123,11 @@ const { apiURL } = useAppConfig(import.meta.env, import.meta.env.PROD);
|
||||
```ts
|
||||
export interface VbenAdminProAppConfigRaw {
|
||||
VITE_GLOB_API_URL: string;
|
||||
VITE_GLOB_APP_TITLE: string;
|
||||
VITE_GLOB_OTHER_API_URL: string; // [!code ++]
|
||||
}
|
||||
|
||||
export interface ApplicationConfig {
|
||||
apiURL: string;
|
||||
appTitle: string;
|
||||
otherApiURL: string; // [!code ++]
|
||||
}
|
||||
```
|
||||
@@ -159,17 +156,12 @@ const { otherApiURL } = useAppConfig(import.meta.env, import.meta.env.PROD);
|
||||
import { useAppConfig } from '@vben/hooks';
|
||||
import { defineOverridesPreferences } from '@vben/preferences';
|
||||
|
||||
const { appTitle } = useAppConfig(import.meta.env, import.meta.env.PROD);
|
||||
|
||||
/**
|
||||
* @description 项目配置文件
|
||||
* 只需要覆盖项目中的一部分配置,不需要的配置不用覆盖,会自动使用默认配置
|
||||
*/
|
||||
export const overridesPreferences = defineOverridesPreferences({
|
||||
// overrides
|
||||
app: {
|
||||
name: appTitle,
|
||||
},
|
||||
});
|
||||
```
|
||||
|
||||
|
@@ -22,7 +22,7 @@ VITE_INJECT_APP_LOADING=false
|
||||
|
||||
::: tip
|
||||
|
||||
- 你可以使用跟`index.html`一样的语法,比如`VITE_GLOB_APP_TITLE`变量,来获取应用的标题。
|
||||
- 你可以使用跟`index.html`一样的语法,比如`VITE_APP_TITLE`变量,来获取应用的标题。
|
||||
- 必须保证有一个`id="__app-loading__"`的元素。
|
||||
- 必须保证有一个`style[data-app-loading="inject-css"]`的元素。
|
||||
|
||||
@@ -32,6 +32,6 @@ VITE_INJECT_APP_LOADING=false
|
||||
</style>
|
||||
<div id="__app-loading__">
|
||||
<!-- ... -->
|
||||
<div class="title"><%= VITE_GLOB_APP_TITLE %></div>
|
||||
<div class="title"><%= VITE_APP_TITLE %></div>
|
||||
</div>
|
||||
```
|
||||
|
Reference in New Issue
Block a user