Remove code/docusaurus from index

This commit is contained in:
oneao committed 2026-01-09 14:31:39 +08:00
1 parent 357e0e09c0
commit 5229212ed0
150 files changed
+5 -17966

No files matched your search

+3
View File
@@ -0,0 +1,3 @@
[submodule "docusaurus"]
path = docusaurus
url = https://github.com/oneao/docusaurus
-20
View File
@@ -1,20 +0,0 @@
# Dependencies
/node_modules
# Production
/build
# Generated files
.docusaurus
.cache-loader
# Misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
-4
View File
@@ -1,4 +0,0 @@
{
"recommendations": [
]
}
-57
View File
@@ -1,57 +0,0 @@
{
"editor.defaultFormatter": "oxc.oxc-vscode",
" editor.formatOnSave": true,
// Disable the default formatter, use eslint instead
"prettier.enable": false,
"editor.formatOnSave": false,
// Auto fix
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit",
"source.organizeImports": "never"
},
// Silent the stylistic rules in your IDE, but still auto fix them
"eslint.rules.customizations": [
{ "rule": "style/*", "severity": "off", "fixable": true },
{ "rule": "format/*", "severity": "off", "fixable": true },
{ "rule": "*-indent", "severity": "off", "fixable": true },
{ "rule": "*-spacing", "severity": "off", "fixable": true },
{ "rule": "*-spaces", "severity": "off", "fixable": true },
{ "rule": "*-order", "severity": "off", "fixable": true },
{ "rule": "*-dangle", "severity": "off", "fixable": true },
{ "rule": "*-newline", "severity": "off", "fixable": true },
{ "rule": "*quotes", "severity": "off", "fixable": true },
{ "rule": "*semi", "severity": "off", "fixable": true }
],
// Enable eslint for all supported languages
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"vue",
"html",
"markdown",
"json",
"json5",
"jsonc",
"yaml",
"toml",
"xml",
"gql",
"graphql",
"astro",
"svelte",
"css",
"less",
"scss",
"pcss",
"postcss"
],
"markdown.copyFiles.destination": {
"**/*.md": "${documentDirName}/assets/${unixTime}.${fileExtName}"
}
}
-41
View File
@@ -1,41 +0,0 @@
# Website
This website is built using [Docusaurus](https://docusaurus.io/), a modern static website generator.
## Installation
```bash
yarn
```
## Local Development
```bash
yarn start
```
This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
## Build
```bash
yarn build
```
This command generates static content into the `build` directory and can be served using any static contents hosting service.
## Deployment
Using SSH:
```bash
USE_SSH=true yarn deploy
```
Not using SSH:
```bash
GIT_USER=<Your GitHub username> yarn deploy
```
If you are using GitHub pages for hosting, this command is a convenient way to build the website and push to the `gh-pages` branch.
@@ -1,12 +0,0 @@
---
slug: first-blog-post
title: First Blog Post
authors: [slorber, yangshun]
tags: [hola, docusaurus]
---
Lorem ipsum dolor sit amet...
<!-- truncate -->
...consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
@@ -1,44 +0,0 @@
---
slug: long-blog-post
title: Long Blog Post
authors: yangshun
tags: [hello, docusaurus]
---
This is the summary of a very long blog post,
Use a `<!--` `truncate` `-->` comment to limit blog post size in the list view.
<!-- truncate -->
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies. Fusce rhoncus ipsum tempor eros aliquam consequat. Lorem ipsum dolor sit amet
@@ -1,24 +0,0 @@
---
slug: mdx-blog-post
title: MDX Blog Post
authors: [slorber]
tags: [docusaurus]
---
Blog posts support [Docusaurus Markdown features](https://docusaurus.io/docs/markdown-features), such as [MDX](https://mdxjs.com/).
:::tip
Use the power of React to create interactive blog posts.
:::
{/* truncate */}
For example, use JSX to create an interactive button:
```js
<button onClick={() => alert("button clicked!")}>Click me!</button>
```
<button onClick={() => alert("button clicked!")}>Click me!</button>
Binary file not shown.

Before

Width:  |  Height:  |  Size: 94 KiB

@@ -1,29 +0,0 @@
---
slug: welcome
title: Welcome
authors: [slorber, yangshun]
tags: [facebook, hello, docusaurus]
---
[Docusaurus blogging features](https://docusaurus.io/docs/blog) are powered by the [blog plugin](https://docusaurus.io/docs/api/plugins/@docusaurus/plugin-content-blog).
Here are a few tips you might find useful.
<!-- truncate -->
Simply add Markdown files (or folders) to the `blog` directory.
Regular blog authors can be added to `authors.yml`.
The blog post date can be extracted from filenames, such as:
- `2019-05-30-welcome.md`
- `2019-05-30-welcome/index.md`
A blog post folder can be convenient to co-locate blog post images:
![Docusaurus Plushie](./docusaurus-plushie-banner.jpeg)
The blog supports tags as well!
**And if you don't want a blog**: just delete this directory, and use `blog: false` in your Docusaurus config.
-25
View File
@@ -1,25 +0,0 @@
yangshun:
name: Yangshun Tay
title: Ex-Meta Staff Engineer, Co-founder GreatFrontEnd
url: https://linkedin.com/in/yangshun
image_url: https://github.com/yangshun.png
page: true
socials:
x: yangshunz
linkedin: yangshun
github: yangshun
newsletter: https://www.greatfrontend.com
slorber:
name: Sébastien Lorber
title: Docusaurus maintainer
url: https://sebastienlorber.com
image_url: https://github.com/slorber.png
page:
# customize the url of the author page at /blog/authors/<permalink>
permalink: "/all-sebastien-lorber-articles"
socials:
x: sebastienlorber
linkedin: sebastienlorber
github: slorber
newsletter: https://thisweekinreact.com
-19
View File
@@ -1,19 +0,0 @@
facebook:
label: Facebook
permalink: /facebook
description: Facebook tag description
hello:
label: Hello
permalink: /hello
description: Hello tag description
docusaurus:
label: Docusaurus
permalink: /docusaurus
description: Docusaurus tag description
hola:
label: Hola
permalink: /hola
description: Hola tag description
@@ -1,9 +0,0 @@
[React Native](https://reactnative.dev/) 是一个开源框架,用于构建跨平台的移动应用。它允许开发者使用 React 来构建原生的 iOS 和 Android 应用。
主要特点:
- 跨平台开发:通过一次编写代码,React Native 可以在 iOS 和 Android 上运行,大大减少开发时间和成本。
- 原生性能:React Native 使用原生组件(如按钮、文本框等),提供接近原生应用的性能和用户体验。
- 热重载:开发者可以实时查看代码修改的效果,而无需重新加载整个应用。
- 组件化开发:通过 React 的组件化理念,开发者可以更高效地构建和维护应用界面。
- 丰富的生态系统:React Native 拥有大量的第三方库和工具,帮助开发者快速实现功能。
@@ -1,8 +0,0 @@
[Expo](https://docs.expo.dev/) 是一个基于 React Native 的框架,旨在简化移动应用开发。它提供了一套工具和服务,让开发者可以更快速地构建、测试和发布 React Native 应用。
主要特点:
- 快速上手:无需复杂配置,直接在手机上查看代码效果。
- 内置功能:相机、位置服务、推送通知等常用功能,免去手动集成。
- 跨平台支持:同一套代码可在 iOS 和 Android 上运行。
- 热重载:修改代码后,应用会即时更新,提升开发效率。
@@ -1,22 +0,0 @@
创建项目命令:
```bash
pnpm create expo-app@latest --template blank-typescript
```
[官网模板](https://docs.expo.dev/more/create-expo/) 如下:
| 模板名称 | 描述 |
| ------------------------------------------------------------ | ------------------------------------------------------------ |
| [`default`](https://github.com/expo/expo/tree/main/templates/expo-template-default) | 默认模板,用于构建多页面应用。包含推荐工具,如 **Expo CLI**、**Expo Router** 路由库,并启用 **TypeScript** 配置。适合大多数应用。 |
| [`blank`](https://github.com/expo/expo/tree/main/templates/expo-template-blank) | 最简模板,仅安装最基本依赖,不包含导航配置。 |
| [`blank-typescript`](https://github.com/expo/expo/tree/main/templates/expo-template-blank-typescript) | 空白模板,但启用了 **TypeScript** 支持。 |
| [`tabs`](https://github.com/expo/expo/tree/main/templates/expo-template-tabs) | 启用基于文件的路由系统(Expo Router),并默认使用 **TypeScript**,适合多标签页结构的应用。 |
| [`bare-minimum`](https://github.com/expo/expo/tree/main/templates/expo-template-bare-minimum) | 带有原生目录(`android` 与 `ios`)的空白模板,创建时会自动运行 [`npx expo prebuild`](https://docs.expo.dev/workflow/prebuild)。适合需要直接修改原生代码的项目。 |
**启动项目:**
```bash
npx expo start
```
@@ -1,166 +0,0 @@
**生成基础文件**,后面要用到:
```bash
npx expo customize babel.config.js
npx expo customize metro.config.js
```
## 配置eslint格式化
可以使用快捷命令(推荐):
```bash
pnpm dlx @antfu/eslint-config@latest
```
安装:
```bash
pnpm i -D eslint @antfu/eslint-config
```
新建 `eslint.config.mjs` 文件:
```js
import antfu from '@antfu/eslint-config'
export default antfu({
stylistic: {
indent: 2, // 缩进为 2 个空格(可选 4 或 'tab')
quotes: 'single', // 使用单引号(可选 'double')
},
rules: {
'unused-imports/no-unused-imports': 'warn',
'unused-imports/no-unused-vars': 'warn',
'@typescript-eslint/no-use-before-define': 'off', // 关闭 TS 的“定义前使用”警告
'no-console': 'off', // 关闭 console 报错
},
})
```
配置 vscode 模板,修改 `.vscode/settings.json` :
> 注意安装 eslint 插件
```json
{
// Disable the default formatter, use eslint instead
"prettier.enable": false,
"editor.formatOnSave": false,
// Auto fix
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit",
"source.organizeImports": "never"
},
// Silent the stylistic rules in you IDE, but still auto fix them
"eslint.rules.customizations": [
{ "rule": "style/*", "severity": "off", "fixable": true },
{ "rule": "format/*", "severity": "off", "fixable": true },
{ "rule": "*-indent", "severity": "off", "fixable": true },
{ "rule": "*-spacing", "severity": "off", "fixable": true },
{ "rule": "*-spaces", "severity": "off", "fixable": true },
{ "rule": "*-order", "severity": "off", "fixable": true },
{ "rule": "*-dangle", "severity": "off", "fixable": true },
{ "rule": "*-newline", "severity": "off", "fixable": true },
{ "rule": "*quotes", "severity": "off", "fixable": true },
{ "rule": "*semi", "severity": "off", "fixable": true }
],
// Enable eslint for all supported languages
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"vue",
"html",
"markdown",
"json",
"jsonc",
"yaml",
"toml",
"xml",
"gql",
"graphql",
"astro",
"svelte",
"css",
"less",
"scss",
"pcss",
"postcss"
]
}
```
## 配置深度链接
作用:通过链接就可以跳转到该app。
在 `app.json` 文件下进行配置:
```json
{
"expo": {
"scheme": "oneao"
}
}
```
然后就可以通过这个配置 从别的应用或者浏览器跳转到你的app:
```
oneao://courses/react-native
```
## 定义 src 路径别名 @
> 参考:https://docs.expo.dev/guides/typescript/
修改 `tsconfig.json` 文件:
```json
{
"extends": "expo/tsconfig.base",
"compilerOptions": {
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
},
"strict": true
}
}
```
安装 `module-resolver` :
```
pnpm add -D babel-plugin-module-resolver
```
修改 `babel.config.js` :
```js
module.exports = function (api) {
api.cache(true)
return {
presets: [
['babel-preset-expo', { jsxImportSource: 'nativewind' }],
'nativewind/babel',
],
plugins: [
[
'module-resolver',
{
root: ['./src'],
alias: {
'@': './src',
},
},
],
],
}
}
```
@@ -1,189 +0,0 @@
## 云打包
1. 安装 EAS CLI
```bash
npm install -g eas-cli
```
2. 注册并登录 Expo 账户
- 访问 https://expo.dev/ 注册账户,然后命令行登录:
```bash
expo login
```
3. 配置项目构建
- 输入以下命令,选择 Android 平台即可。
```bash
eas build:configure
```
4. 构建 Android 包
- 默认构建 AAB 包(上传 Google Play):
```bash
eas build --platform android
```
- 构建 APK(可直接安装):
```bash
eas build -p android --profile preview
```
## 本地打包(EAS方式)
## 本地打包(原生方式)
### 1. 安装 [Android Studio]( https://developer.android.com/?hl=zh-cn)
1. 下载安装
- 按照官网提示依次安装 SDK 工具和必要组件。
- 安装完成后,记住 SDK 的安装路径(例如:`D:\data\sdk`,默认位置是:`C:\Users\<你的用户名>\AppData\Local\Android\Sdk`),后续需要用到。
2. 配置环境变量
- 打开 **系统属性 → 高级 → 环境变量**。
- 在 **系统变量** 中新增:
```
变量名:ANDROID_HOME
变量值:D:\data\sdk
```
- 在 **Path** 中新增:
```bash
%ANDROID_HOME%\platform-tools
%ANDROID_HOME%\tools
%ANDROID_HOME%\tools\bin
```
- 保存设置。
3. 验证安装
- 打开命令行,执行:
```
echo %ANDROID_HOME%
```
- 如果输出 SDK 路径,则说明配置成功。
### 2. 安装 [jdk17](https://adoptium.net/zh-CN/temurin/releases?version=8&os=any&arch=any)
1. 下载安装
- 下载对应版本解压即可。
- 安装成功后,记住 jdk 的安装路径,后续需要用到。
2. 配置环境变量
- 打开 **系统属性 → 高级 → 环境变量**。
- 在 **系统变量** 中新增:
```bash
变量名:JAVA_HOME
变量值:D:\devtool\jdk\jdk-17.0.16+8
```
- 在 **Path** 中新增:
```bash
%JAVA_HOME%\bin
```
- 保存设置。
3. 验证安装
- 打开命令行,执行:
```bash
java --version
```
- 如果输出 jdk 的信息,则说明配置成功。
### 3. Expo 项目启用 [Prebuild](https://docs.expo.dev/workflow/prebuild/)
1. 生成原生项目
```bash
npx expo prebuild
```
然后执行完毕后,会生成 `android` 目录。
2. 清除并重新生成原生项目
```bash
npx expo prebuild --clean
```
会删除已有的 `android` 和 `ios` 目录,然后重新生成。
## 打包体积优化
方法一:找到 `android/gradle.properties` 文件,找到 `reactNativeArchitectures` ,根据需要删除即可
```properties
reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
```
方法二:原生方法,在 `android/app/build.gradle` 文件中添加或修改以下配置:
```
android {
// 其他配置...
splits {
abi {
enable true // 启用按 CPU 架构拆分
reset() // 重置默认架构列表
include 'arm64-v8a', 'armeabi-v7a'
universalApk false // 是否生成包含所有架构的通用 APK(false 表示只生成分架构的独立包)
// 还有一个 exclude 配置是排除指定架构的
}
}
// 其他配置...
}
```
**说明:**
- `enable true`:启用架构拆分功能。
- `reset()`:清空默认的架构配置,避免重复。
- `include`:指定要生成的架构包,比如只打 `arm64-v8a` 和 `armeabi-v7a`。
- `universalApk false`:不生成通用包(即包含所有架构的 APK)。
**举例:**
执行打包命令后,将生成多个包,例如:
```
app-arm64-v8a-release.apk
app-armeabi-v7a-release.apk
```
每个 APK 只包含对应架构的二进制文件,体积更小。
如果把 `universalApk` 设置为 `true`,则只会生成一个:
```
app-universal-release.apk
```
这个包能在 `arm64-v8a` 和 `armeabi-v7a` 架构的设备上运行,但体积最大。
@@ -1,7 +0,0 @@
{
"label": "expo",
"position": 1,
"link": {
"type": "generated-index"
}
}
@@ -1,109 +0,0 @@
NativeWind 原子化 CSS 库
> 官网:https://www.nativewind.dev/docs/getting-started/installation
1. 安装依赖
```bash
npx expo add nativewind react-native-reanimated react-native-safe-area-context
npx expo add tailwindcss@^3.4.17 -- --save-dev
```
2. 运行 `npx tailwindcss init` 生成 `tailwind.config.js` 文件,添加配置:
```js
/** @type {import('tailwindcss').Config} */
module.exports = {
// NOTE: Update this to include the paths to all files that contain Nativewind classes.
content: ['./App.tsx', './components/**/*.{js,jsx,ts,tsx}'],
presets: [require('nativewind/preset')],
theme: {
extend: {},
},
plugins: [],
}
```
3. 创建 `global.css` 文件:
```css
@tailwind base;
@tailwind components;
@tailwind utilities;
```
注意在全局引入
4. 修改 `babel.config.js` 文件:
> 如果没有该文件,执行 `npx expo customize babel.config.js` 命令创建。
```js
module.exports = function (api) {
api.cache(true)
return {
presets: [
['babel-preset-expo', { jsxImportSource: 'nativewind' }],
'nativewind/babel',
],
}
}
```
5. 修改 `metro.config.js` 文件:
> 如果没有该文件,执行 `npx expo customize metro.config.js` 命令创建。
```js
const { getDefaultConfig } = require('expo/metro-config')
const { withNativeWind } = require('nativewind/metro')
const config = getDefaultConfig(__dirname)
module.exports = withNativeWind(config, { input: './global.css' })
```
6. 新建 `src/types/nativewind-env.d.ts` 文件:
```ts
/// <reference types="nativewind/types" />
```
7. 安装 ` react-native-css-interop` :
```bash
npx expo install react-native-css-interop
```
8. 检验是否生效
```tsx
import { Text, View } from 'react-native'
import './global.css'
export default function App() {
return (
<View className="flex-1 items-center justify-center bg-white">
<Text className="text-xl font-bold text-blue-500">
Welcome to Nativewind!
</Text>
</View>
)
}
```
如果不生效,记得修改 `tailwind.config.js` 的目标路径:
```js
/** @type {import('tailwindcss').Config} */
module.exports = {
// NOTE: Update this to include the paths to all files that contain Nativewind classes.
content: ['./src/app/_layout.tsx', './src/components/**/*.{js,jsx,ts,tsx}'],
presets: [require('nativewind/preset')],
theme: {
extend: {},
},
plugins: [],
}
```
@@ -1,290 +0,0 @@
Gluestack UI UI 组件库
> 官网:https://gluestack.io/ui/docs/home/getting-started/installation
## 方式一:CLI
```bash
npx gluestack-ui init
```
## 方式二:Manual(推荐)
**前置条件:** 需要安装 `nativewind`
1. 安装依赖:
```bash
npx expo add @gluestack-ui/core @gluestack-ui/utils react-native-svg @gluestack/ui-next-adapter
```
2. 从 [github](https://github.com/gluestack/gluestack-ui/tree/main/src/components/ui/gluestack-ui-provider) 复制必须的组件到 `@/components/ui/gluestack-ui-provider`。
3. 修改 `tailwind.config.js` 文件:
```bash
/** @type {import('tailwindcss').Config} */
module.exports = {
darkMode: process.env.DARK_MODE ? process.env.DARK_MODE : 'class',
content: [
'./app/**/*.{html,js,jsx,ts,tsx,mdx}',
'./components/**/*.{html,js,jsx,ts,tsx,mdx}',
'./utils/**/*.{html,js,jsx,ts,tsx,mdx}',
'./*.{html,js,jsx,ts,tsx,mdx}',
'./src/**/*.{html,js,jsx,ts,tsx,mdx}',
],
presets: [require('nativewind/preset')],
important: 'html',
safelist: [
{
pattern:
// eslint-disable-next-line regexp/no-dupe-disjunctions
/(bg|border|text|stroke|fill)-(primary|secondary|tertiary|error|success|warning|info|typography|outline|background|indicator)-(0|50|100|200|300|400|500|600|700|800|900|950|white|gray|black|error|warning|muted|success|info|light|dark|primary)/,
},
],
theme: {
extend: {
colors: {
primary: {
0: 'rgb(var(--color-primary-0)/<alpha-value>)',
50: 'rgb(var(--color-primary-50)/<alpha-value>)',
100: 'rgb(var(--color-primary-100)/<alpha-value>)',
200: 'rgb(var(--color-primary-200)/<alpha-value>)',
300: 'rgb(var(--color-primary-300)/<alpha-value>)',
400: 'rgb(var(--color-primary-400)/<alpha-value>)',
500: 'rgb(var(--color-primary-500)/<alpha-value>)',
600: 'rgb(var(--color-primary-600)/<alpha-value>)',
700: 'rgb(var(--color-primary-700)/<alpha-value>)',
800: 'rgb(var(--color-primary-800)/<alpha-value>)',
900: 'rgb(var(--color-primary-900)/<alpha-value>)',
950: 'rgb(var(--color-primary-950)/<alpha-value>)',
},
secondary: {
0: 'rgb(var(--color-secondary-0)/<alpha-value>)',
50: 'rgb(var(--color-secondary-50)/<alpha-value>)',
100: 'rgb(var(--color-secondary-100)/<alpha-value>)',
200: 'rgb(var(--color-secondary-200)/<alpha-value>)',
300: 'rgb(var(--color-secondary-300)/<alpha-value>)',
400: 'rgb(var(--color-secondary-400)/<alpha-value>)',
500: 'rgb(var(--color-secondary-500)/<alpha-value>)',
600: 'rgb(var(--color-secondary-600)/<alpha-value>)',
700: 'rgb(var(--color-secondary-700)/<alpha-value>)',
800: 'rgb(var(--color-secondary-800)/<alpha-value>)',
900: 'rgb(var(--color-secondary-900)/<alpha-value>)',
950: 'rgb(var(--color-secondary-950)/<alpha-value>)',
},
tertiary: {
50: 'rgb(var(--color-tertiary-50)/<alpha-value>)',
100: 'rgb(var(--color-tertiary-100)/<alpha-value>)',
200: 'rgb(var(--color-tertiary-200)/<alpha-value>)',
300: 'rgb(var(--color-tertiary-300)/<alpha-value>)',
400: 'rgb(var(--color-tertiary-400)/<alpha-value>)',
500: 'rgb(var(--color-tertiary-500)/<alpha-value>)',
600: 'rgb(var(--color-tertiary-600)/<alpha-value>)',
700: 'rgb(var(--color-tertiary-700)/<alpha-value>)',
800: 'rgb(var(--color-tertiary-800)/<alpha-value>)',
900: 'rgb(var(--color-tertiary-900)/<alpha-value>)',
950: 'rgb(var(--color-tertiary-950)/<alpha-value>)',
},
error: {
0: 'rgb(var(--color-error-0)/<alpha-value>)',
50: 'rgb(var(--color-error-50)/<alpha-value>)',
100: 'rgb(var(--color-error-100)/<alpha-value>)',
200: 'rgb(var(--color-error-200)/<alpha-value>)',
300: 'rgb(var(--color-error-300)/<alpha-value>)',
400: 'rgb(var(--color-error-400)/<alpha-value>)',
500: 'rgb(var(--color-error-500)/<alpha-value>)',
600: 'rgb(var(--color-error-600)/<alpha-value>)',
700: 'rgb(var(--color-error-700)/<alpha-value>)',
800: 'rgb(var(--color-error-800)/<alpha-value>)',
900: 'rgb(var(--color-error-900)/<alpha-value>)',
950: 'rgb(var(--color-error-950)/<alpha-value>)',
},
success: {
0: 'rgb(var(--color-success-0)/<alpha-value>)',
50: 'rgb(var(--color-success-50)/<alpha-value>)',
100: 'rgb(var(--color-success-100)/<alpha-value>)',
200: 'rgb(var(--color-success-200)/<alpha-value>)',
300: 'rgb(var(--color-success-300)/<alpha-value>)',
400: 'rgb(var(--color-success-400)/<alpha-value>)',
500: 'rgb(var(--color-success-500)/<alpha-value>)',
600: 'rgb(var(--color-success-600)/<alpha-value>)',
700: 'rgb(var(--color-success-700)/<alpha-value>)',
800: 'rgb(var(--color-success-800)/<alpha-value>)',
900: 'rgb(var(--color-success-900)/<alpha-value>)',
950: 'rgb(var(--color-success-950)/<alpha-value>)',
},
warning: {
0: 'rgb(var(--color-warning-0)/<alpha-value>)',
50: 'rgb(var(--color-warning-50)/<alpha-value>)',
100: 'rgb(var(--color-warning-100)/<alpha-value>)',
200: 'rgb(var(--color-warning-200)/<alpha-value>)',
300: 'rgb(var(--color-warning-300)/<alpha-value>)',
400: 'rgb(var(--color-warning-400)/<alpha-value>)',
500: 'rgb(var(--color-warning-500)/<alpha-value>)',
600: 'rgb(var(--color-warning-600)/<alpha-value>)',
700: 'rgb(var(--color-warning-700)/<alpha-value>)',
800: 'rgb(var(--color-warning-800)/<alpha-value>)',
900: 'rgb(var(--color-warning-900)/<alpha-value>)',
950: 'rgb(var(--color-warning-950)/<alpha-value>)',
},
info: {
0: 'rgb(var(--color-info-0)/<alpha-value>)',
50: 'rgb(var(--color-info-50)/<alpha-value>)',
100: 'rgb(var(--color-info-100)/<alpha-value>)',
200: 'rgb(var(--color-info-200)/<alpha-value>)',
300: 'rgb(var(--color-info-300)/<alpha-value>)',
400: 'rgb(var(--color-info-400)/<alpha-value>)',
500: 'rgb(var(--color-info-500)/<alpha-value>)',
600: 'rgb(var(--color-info-600)/<alpha-value>)',
700: 'rgb(var(--color-info-700)/<alpha-value>)',
800: 'rgb(var(--color-info-800)/<alpha-value>)',
900: 'rgb(var(--color-info-900)/<alpha-value>)',
950: 'rgb(var(--color-info-950)/<alpha-value>)',
},
typography: {
0: 'rgb(var(--color-typography-0)/<alpha-value>)',
50: 'rgb(var(--color-typography-50)/<alpha-value>)',
100: 'rgb(var(--color-typography-100)/<alpha-value>)',
200: 'rgb(var(--color-typography-200)/<alpha-value>)',
300: 'rgb(var(--color-typography-300)/<alpha-value>)',
400: 'rgb(var(--color-typography-400)/<alpha-value>)',
500: 'rgb(var(--color-typography-500)/<alpha-value>)',
600: 'rgb(var(--color-typography-600)/<alpha-value>)',
700: 'rgb(var(--color-typography-700)/<alpha-value>)',
800: 'rgb(var(--color-typography-800)/<alpha-value>)',
900: 'rgb(var(--color-typography-900)/<alpha-value>)',
950: 'rgb(var(--color-typography-950)/<alpha-value>)',
white: '#FFFFFF',
gray: '#D4D4D4',
black: '#181718',
},
outline: {
0: 'rgb(var(--color-outline-0)/<alpha-value>)',
50: 'rgb(var(--color-outline-50)/<alpha-value>)',
100: 'rgb(var(--color-outline-100)/<alpha-value>)',
200: 'rgb(var(--color-outline-200)/<alpha-value>)',
300: 'rgb(var(--color-outline-300)/<alpha-value>)',
400: 'rgb(var(--color-outline-400)/<alpha-value>)',
500: 'rgb(var(--color-outline-500)/<alpha-value>)',
600: 'rgb(var(--color-outline-600)/<alpha-value>)',
700: 'rgb(var(--color-outline-700)/<alpha-value>)',
800: 'rgb(var(--color-outline-800)/<alpha-value>)',
900: 'rgb(var(--color-outline-900)/<alpha-value>)',
950: 'rgb(var(--color-outline-950)/<alpha-value>)',
},
background: {
0: 'rgb(var(--color-background-0)/<alpha-value>)',
50: 'rgb(var(--color-background-50)/<alpha-value>)',
100: 'rgb(var(--color-background-100)/<alpha-value>)',
200: 'rgb(var(--color-background-200)/<alpha-value>)',
300: 'rgb(var(--color-background-300)/<alpha-value>)',
400: 'rgb(var(--color-background-400)/<alpha-value>)',
500: 'rgb(var(--color-background-500)/<alpha-value>)',
600: 'rgb(var(--color-background-600)/<alpha-value>)',
700: 'rgb(var(--color-background-700)/<alpha-value>)',
800: 'rgb(var(--color-background-800)/<alpha-value>)',
900: 'rgb(var(--color-background-900)/<alpha-value>)',
950: 'rgb(var(--color-background-950)/<alpha-value>)',
error: 'rgb(var(--color-background-error)/<alpha-value>)',
warning: 'rgb(var(--color-background-warning)/<alpha-value>)',
muted: 'rgb(var(--color-background-muted)/<alpha-value>)',
success: 'rgb(var(--color-background-success)/<alpha-value>)',
info: 'rgb(var(--color-background-info)/<alpha-value>)',
light: '#FBFBFB',
dark: '#181719',
},
indicator: {
primary: 'rgb(var(--color-indicator-primary)/<alpha-value>)',
info: 'rgb(var(--color-indicator-info)/<alpha-value>)',
error: 'rgb(var(--color-indicator-error)/<alpha-value>)',
},
},
fontFamily: {
'heading': undefined,
'body': undefined,
'mono': undefined,
'jakarta': ['var(--font-plus-jakarta-sans)'],
'roboto': ['var(--font-roboto)'],
'code': ['var(--font-source-code-pro)'],
'inter': ['var(--font-inter)'],
'space-mono': ['var(--font-space-mono)'],
},
fontWeight: {
extrablack: '950',
},
fontSize: {
'2xs': '10px',
},
boxShadow: {
'hard-1': '-2px 2px 8px 0px rgba(38, 38, 38, 0.20)',
'hard-2': '0px 3px 10px 0px rgba(38, 38, 38, 0.20)',
'hard-3': '2px 2px 8px 0px rgba(38, 38, 38, 0.20)',
'hard-4': '0px -3px 10px 0px rgba(38, 38, 38, 0.20)',
'hard-5': '0px 2px 10px 0px rgba(38, 38, 38, 0.10)',
'soft-1': '0px 0px 10px rgba(38, 38, 38, 0.1)',
'soft-2': '0px 0px 20px rgba(38, 38, 38, 0.2)',
'soft-3': '0px 0px 30px rgba(38, 38, 38, 0.1)',
'soft-4': '0px 0px 40px rgba(38, 38, 38, 0.1)',
},
},
},
}
```
4. 使用 `GluestackUIProvider` 包括着整个组件:
```tsx
// App.tsx
import { GluestackUIProvider } from '@/components/ui/gluestack-ui-provider'
import '@/global.css' // Make sure this path is correct
export default function App() {
return (
<GluestackUIProvider>{/* Add your app code here */}</GluestackUIProvider>
)
}
```
## 测试
下载对应组件:
```bash
npx gluestack-ui add button
```
引入使用:
```tsx
import { StyleSheet, Text, View } from 'react-native'
import { SafeAreaView } from 'react-native-safe-area-context'
import { Button, ButtonText } from '@/components/ui/button'
import { GluestackUIProvider } from '@/components/ui/gluestack-ui-provider'
import '@/styles/global.css'
export default function Layout() {
return (
<GluestackUIProvider>
<SafeAreaView style={styles.container}>
<View className="flex-1 items-center justify-center bg-white">
<Text className="text-xl font-bold text-blue-500">
Welcome to Nativewind!
</Text>
<Button>
<ButtonText>你好</ButtonText>
</Button>
</View>
</SafeAreaView>
</GluestackUIProvider>
)
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#f5f5f5',
paddingHorizontal: 16,
}
})
```
@@ -1,6 +0,0 @@
Lucide 是一个轻量级、开源的图标库
> 官网:https://lucide.dev/icons/
```bash
npx expo add lucide-react-native
```
@@ -1,7 +0,0 @@
{
"label": "第三方库",
"position": 2,
"link": {
"type": "generated-index"
}
}
@@ -1,34 +0,0 @@
## 设置页面背景色
在 `pages.json` 中设置 `backgroundColor` 并未生效。
设置全局背景色在 `App.vue` 中进行设置
```css
<!--此标签需要新建,不要和样式搞在一起-->
<style>
page {
background-color: #f5f7fa;
}
</style>
```
设置单个页面背景色就在对应的页面中设置
```css
<!--此标签需要新建,不要和样式搞在一起-->
<style scoped>
page {
background-color: red;
}
</style>
```
``` css
<style>
page {
background-color: #f5f7fa;
}
</style>
```
@@ -1,100 +0,0 @@
## 白屏问题
环境:
- 浏览器:Chrome56
- Unibest:快速开发框架,官网:https://unibest.tech/
出现白屏参考上面的方案。
使用的是 Vscode 模板的话,直接参考
使用的是 Hbuilderx 模板的话,在根目录下添加`vite.config.js`文件
```js
import Uni from '@dcloudio/vite-plugin-uni'
import legacy from '@vitejs/plugin-legacy'
import { defineConfig } from 'vite'
export default defineConfig({
plugins: [
uni(),
legacyPlugin({
// 配置参考上面的 md 文件
})
]
})
```
## 原生Tabbar遮挡
如果Uniapp原生的Tabbar会遮挡一部分内容,这是因为部分低版本浏览器可能不支持 `env` 计算函数,所以导致整个样式设置失效。
**解决方案:**
新建 `/hooks/useSafeAreaBottom` 文件夹
在该目录下新建 `index.ts` 和 `index.css` 文件,添加一下内容
`index.css`:
```css
.safe-area-bottom {
padding-bottom: 50px;
padding-bottom: calc(50px + constant(safe-area-inset-bottom));
padding-bottom: calc(50px + env(safe-area-inset-bottom));
}
// 设置为50px是因为Uniapp的tabber的高度固定为50px。
```
`index.ts`:
```ts
import './index.css'
export function useSafeAreaBottom(): {
safeAreaInsets: UniApp.GetSystemInfoResult['safeAreaInsets']
needSafeAreaBottom: boolean
} {
const systemInfo = uni.getSystemInfoSync()
const safeAreaInsets: UniApp.GetSystemInfoResult['safeAreaInsets']
= systemInfo.safeAreaInsets ?? {
top: 0,
bottom: 0,
left: 0,
right: 0,
}
// ✅ 仅检测是否支持 env(safe-area-inset-bottom)
const supportsEnv
= typeof window !== 'undefined'
&& 'CSS' in window
&& typeof CSS.supports === 'function'
&& CSS.supports('padding-bottom', 'env(safe-area-inset-bottom)')
const needSafeAreaBottom = !supportsEnv
return {
safeAreaInsets,
needSafeAreaBottom,
}
}
```
使用:
```html
<template>
<view
:class="{ 'safe-area-bottom': needSafeAreaBottom }"
:style="{ marginTop: safeAreaInsets.top + 'px' }"
>
</view>
</template>
<script lang="ts" setup>
import { useSafeAreaBottom } from '@/hooks/useSafeAreaBottom/index'
const { safeAreaInsets, needSafeAreaBottom } = useSafeAreaBottom()
</script>
```
@@ -1,381 +0,0 @@
> 背景:现在使用 HBuilderX 打自定义基座的话,一个账号会有限制次数。并且时间过慢。
## 1. 安装 Android Studio
使用该工具进行自定义基座。
下载地址:https://developer.android.com/studio?hl=zh-cn
按照顺序安装即可,注意SDK的位置不要安装到C盘
## 2. 下载 HBuilderX 离线SDK
下载地址:https://nativesupport.dcloud.net.cn/AppDocs/download/android.html
**注意:下载的 SDK 的版本需要与 HBuilderX 的版本保持一致。**
历史版本:https://pan.baidu.com/share/init?surl=KtOCtMZJSgfAayHNjTpdTg&pwd=4hvi
## 3. 导入 HBuilder-Integrate-AS 项目到 Android Studio
解压从 HBuilderX 下载后的 Android-SDK,使用 Android Studio 打开解压后的 HBuilder-Integrate-AS 项目。
![alt text](assets/1767860095770.png)
导入成功后,会发现目录只有部分内容。
![alt text](assets/1767860105639.png)
这时候需要将 Android 更新为 Project 既可查看到项目全部内容
![alt text](assets/1767860116406.png)
修改后的效果
![alt text](assets/1767860127749.png)
## 4. 配置 Andriod Studio
配置 JDK ,配置路径:Settings - Build - Build Tools - Gradle
将 Gradle JDK 的路径修改为本地的路径,修改后点击 `Apply` 即可。注意:JDK 的版本需要和 Gradle 的版本进行适配,如果不适配那么运行的时候也会有详细的报错信息。
![alt text](assets/1767860213983.png)
## 5. Uniapp开发者中心 申请相关信息
### 5.1 创建应用
首先根据应用名称检查是否已经存在当前的项目。
![alt text](assets/1767860225084.png)
有过没有的话则点击右上角的 `创建应用` 按钮进行创建:
![alt text](assets/1767860300109.png)
创建成功后会添加到 **我的应用** 列表中
![alt text](assets/1767860311950.png)
点击对应的 **应用名称** 即可进入对应的应用
### 5.2 申请云端证书
点击创建证书
![alt text](assets/1767860326407.png)
因为需要时间,过段时间刷新即可
![alt text](assets/1767860336247.png)
创建成功后,点击 **证书详情 ** 这里面有需要的一些信息。
需要的有 别名、MD5、SHA1、SHA256
![alt text](assets/1767860347571.png)
同时还需要证书密码,点击 **查看证书密码 ** 即可获取到。
![alt text](assets/1767860358483.png)
现在记录的信息有: 别名、MD5、SHA1、SHA256、证书密码
注意下载申请过的证书,后面需要用到
![alt text](assets/1767860370727.png)
### 5.3 新增平台信息
进入 **各平台信息** ,点击 **新增** 按钮
![alt text](assets/1767860380849.png)
填写以下信息,注意填写包名(任意),该包名后面使用到。这个时候 SHA1、MD5、SHA256 就是在 [5.2 申请云端证书](#52-申请云端证书) 章节申请的信息。
![alt text](assets/1767860391828.png)
创建成功后就会显示
![alt text](assets/1767860402803.png)
创建离线Key,点击刚刚创建的平台信息的 创建离线Key 按钮
![alt text](assets/1767860413675.png)
点击进行创建,创建成功后,会显示 **查看离线Key**
![alt text](assets/1767860423452.png)
点击查看对应的离线Key,主要保留该值,后面会用到
## 6. 配置导入过的 HBuilder-Integrate-AS 项目
配置 `HBuilder-Integrate-AS\simpleDemo\build.gradle` ,这些修改的信息 已经都在 [5. Uniapp开发者中心 申请相关信息](#5-Uniapp开发者中心 申请相关信息) 申请过了,我已标注。注意下载云端证书,并放到 simpleDemo 目录下。
![alt text](assets/1767860437778.png)
替换 离线Key(该值就在 [5.3 新增平台信息](#53-新增平台信息) 申请过了),配置 `HBuilder-Integrate-AS\simpleDemo\src\main\AndroidManifest.xml` 文件。
![alt text](assets/1767860447485.png)
配置 `HBuilder-Integrate-AS\simpleDemo\src\main\assets\data\dcloud_control.xml` ,替换自己项目的appid。
![alt text](assets/1767860459644.png)
## 7. Hbuilder X 导出本地打包资源
注意 APPID 需要和创建应用的 appid 保持一致。如果不一致,可以去源码视图进行修改
![alt text](assets/1767860475275.png)
导出成功后,路径参考:
![alt text](assets/1767860484887.png)
复制 **resources** 文件夹下面文件夹,然后替换 **HBuilder-Integrate-AS** 项目中的 `HBuilder-Integrate-AS\simpleDemo\src\main\assets\apps\__UNI__A` 目录,将 `__UNI__A` 文件夹替换为导出的 `__UNI__9063282` 文件夹,替换后如下:
![alt text](assets/1767860494289.png)
确保 应用版本名称 和 应用版本号保持一致
![alt text](assets/1767860503374.png)
![alt text](assets/1767860510261.png)
## 8. 运行项目
先进行加载配置好的项目
![alt text](assets/1767860524973.png)
加载成功后即可出现蓝色运行按钮,点击运行即可
![alt text](assets/1767860536194.png)
## 9. 导入原生插件
> 如果不需要该步可以忽略,不影响自定义基座。
参考网站:https://zh.uniapp.dcloud.io/plugin/native-plugin.html#%E6%9C%AC%E5%9C%B0%E6%8F%92%E4%BB%B6-%E9%9D%9E%E5%86%85%E7%BD%AE%E5%8E%9F%E7%94%9F%E6%8F%92%E4%BB%B6
### 9.1 下载插件
这里用 **DCloud-RichAlert** 举例,插件下载地址:https://ext.dcloud.net.cn/plugin?id=36
下载完毕后,新建 **nativeplugins** 文件夹,将解压后的插件放到该文件夹下面
![alt text](assets/1767860546989.png)
9.2 配置本地插件
![alt text](assets/1767860556154.png)
选择插件
![alt text](assets/1767860566602.png)
配置成功页面
![alt text](assets/1767860575227.png)
然后就可以使用啦,在页面中添加测试代码
```html
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: 'Hello',
}
},
onLoad() {
const dcRichAlert = uni.requireNativePlugin('DCloud-RichAlert')
dcRichAlert.show(
{
position: 'bottom',
title: '提示信息',
titleColor: '#FF0000',
content:
"<a href='https://uniapp.dcloud.io/' value='Hello uni-app'>uni-app</a> 是一个使用 Vue.js 开发跨平台应用的前端框架!\n免费的\n免费的\n免费的\n重要的事情说三遍",
contentAlign: 'left',
checkBox: {
title: '不再提示',
isSelected: true,
},
buttons: [
{
title: '取消',
},
{
title: '否',
},
{
title: '确认',
titleColor: '#3F51B5',
},
],
},
(result) => {
switch (result.type) {
case 'button':
console.log('callback---button--' + result.index)
break
case 'checkBox':
console.log('callback---checkBox--' + result.isSelected)
break
case 'a':
console.log('callback---a--' + JSON.stringify(result))
break
case 'backCancel':
console.log('callback---backCancel--')
break
}
},
)
},
methods: {},
}
</script>
```
当然,现在还没有结束,如果需要在本地看到效果,需要重复 [7. Hbuilder X 导出本地打包资源](#7-Hbuilder X 导出本地打包资源) 步骤,将新的打包资源将旧的替换掉。
### 9.3 配置项目
**重要的下一步**,将 `nativeplugins\DCloud-RichAlert\android\uniplugin_richalert.aar` 复制到 `HBuilder-Integrate-AS\simpleDemo\libs` 文件夹下。
![alt text](assets/1767860605362.png)
然后呢,还没有结束哦。
在assets目录下创建 **dcloud_uniplugins.json** 文件,添加以下内容
```json
{
"nativePlugins": [
{
"plugins": [
{
"type": "module",
"name": "DCloud-RichAlert",
"class": "uni.dcloud.io.uniplugin_richalert.RichAlertWXModule"
}
]
}
]
}
```
![alt text](assets/1767860623138.png)
### 9.4 配置gradle文件
添加制定依赖。
```
dependencies {
implementation fileTree(dir: 'libs', include: ['*.aar', '*.jar'], exclude: [])
implementation 'androidx.appcompat:appcompat:1.1.0'
implementation 'androidx.localbroadcastmanager:localbroadcastmanager:1.0.0'
implementation 'androidx.core:core:1.1.0'
implementation "androidx.fragment:fragment:1.1.0"
implementation 'androidx.recyclerview:recyclerview:1.1.0'
implementation 'com.facebook.fresco:fresco:2.5.0'
implementation "com.facebook.fresco:animated-gif:2.5.0"
implementation 'com.github.bumptech.glide:glide:4.9.0'
implementation 'com.alibaba:fastjson:1.2.83'
implementation 'androidx.webkit:webkit:1.5.0'
// 基座需要,必须添加。主要是这个是
implementation 'com.github.bumptech.glide:glide:4.9.0'
}
```
![alt text](assets/1767860638268.png)
### 9.5 运行项目
然后就是可以重新运行项目啦。运行成功的结果如下:
![alt text](assets/1767860648404.png)
## 10. 自定义基座
### 10.1 Debug 配置
修改 `HBuilder-Integrate-AS\simpleDemo\src\main\assets\data\dcloud_control.xml` 文件,设置 Debug 模式:
```xml
<hbuilder debug="true" syncDebug="true">
<apps>
<app appid="__UNI__ID" appver=""/>
</apps>
</hbuilder>
```
![alt text](assets/1767860660364.png)
修改 `HBuilder-Integrate-AS\simpleDemo\build.gradle` 在该文件中添加 **okhttp3** 依赖
```
dependencies {
implementation "com.alibaba:fastjson:1.2.83"
implementation "com.squareup.okhttp3:okhttp:3.12.12"
}
```
![alt text](assets/1767860678022.png)
### 10.2 导入 Debug SDK
需要导入的 SDK 位于 `Android-SDK@4.66.82418_20250520\SDK\libs` 中
![alt text](assets/1767860687556.png)
将 **debug-server-release.aar** 复制到 **libs** 下面
![alt text](assets/1767860696316.png)
### 10.3 生成APK文件
![alt text](assets/1767860704777.png)
生成后会生成在 debug 目录下
![alt text](assets/1767860712216.png)
### 10.4 复制APK文件到HBuilderX中
1. 在HBuilderX项目中创建创建 unpackage 目录,在 unpackage 目录中创建 debug 目录,将上述生成的APK文件拷贝到debug目录中。
2. **重命名**文件为 **android_debug.apk**,目录结构参考下图
![alt text](assets/1767860732712.png)
### 10.5 运行自定义基座
![alt text](assets/1767860747593.png)
选择自定义基座
![alt text](assets/1767860756953.png)
点击运行,运行结果如下:
![alt text](assets/1767860772664.png)
同时能支持 **热更新** 。修改下,查看效果吧。
![alt text](assets/1767860784873.png)
## 11. 模块及三方 SDK 配置
参考官网:https://nativesupport.dcloud.net.cn/AppDocs/usemodule/androidModuleConfig/others.html
Binary file not shown.

Before

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.3 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 131 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 30 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 51 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 208 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 212 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 111 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 128 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 62 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 105 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 83 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 137 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 114 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 124 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 39 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 117 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 94 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 26 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 13 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 19 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 16 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 17 KiB

@@ -1,65 +0,0 @@
环境:
- 浏览器:Chrome56
- Vue:^3.5.15
- Vite:6.3.5
解决方案:
`@vitejs/plugin-legacy` ,该包是Vite提供的一个插件,为打包后的文件提供传统浏览器兼容性支持。官网:https://github.com/vitejs/vite/tree/main/packages/plugin-legacy
`terser`,主要用于压缩代码,还有代码混淆、源码映射等功能。
```bash
pnpm i @vitejs/plugin-legacy terser -D
```
安装上述依赖后,在 `vite.config.ts/js` 中添加以下内容:
```ts
import legacy from '@vitejs/plugin-legacy'
// 在插件处添加一下功能
plugins: [
legacy({
// 目标浏览器环境,'defaults' 是浏览器列表默认设置,支持 Chrome 56 及以上
targets: ['defaults', 'Chrome >= 56'],
// 额外引入的兼容性 polyfill,这里加入了对 generator 函数的支持
additionalLegacyPolyfills: ['regenerator-runtime/runtime'],
// 是否生成兼容旧浏览器的代码块(chunk)
renderLegacyChunks: true,
// 需要引入的具体 polyfill 列表,确保目标环境缺失的 API 得到支持
polyfills: [
'es.symbol', // Symbol 支持
'es.array.filter', // Array.prototype.filter 支持
'es.promise', // Promise 支持
'es.promise.finally', // Promise.prototype.finally 支持
'es.object.assign', // Object.assign 支持
'es.map', // Map 支持
'es.set', // Set 支持
'es.array.for-each', // Array.prototype.forEach 支持
'es.object.define-properties', // Object.defineProperties 支持
'es.object.define-property', // Object.defineProperty 支持
'es.object.get-own-property-descriptor', // Object.getOwnPropertyDescriptor 支持
'es.object.get-own-property-descriptors', // Object.getOwnPropertyDescriptors 支持
'es.object.keys', // Object.keys 支持
'es.object.to-string', // Object.prototype.toString 支持
'web.dom-collections.for-each', // DOM 集合的 forEach 支持
'esnext.global-this', // 全局变量 globalThis 支持
'esnext.string.match-all', // String.prototype.matchAll 支持
'es.array.iterator', // 数组迭代器支持
'es.string.includes', // String.prototype.includes 支持
'es.string.starts-with', // String.prototype.startsWith 支持
'es.object.values', // Object.values 支持
],
}),
]
```
`targets` 可以参考:[Browserslist官网](https://github.com/browserslist/browserslist) 查询
**注意该方案只在打包后生效。**
@@ -1,3 +0,0 @@
PostgreSQL(常简称“Postgres”)是一款强调可扩展性和标准兼容性的对象关系型数据库管理系统(ORDBMS)。作为数据库服务器,其核心功能是安全存储数据并支持最佳实践,同时支持本地或网络(含互联网)中的应用程序按需检索数据。它可处理从小型单机应用到高并发互联网应用的各类负载,最新版本还支持数据库复制以提升安全性和可扩展性。
PostgreSQL 实现了 SQL:2011 标准的大部分功能,支持 ACID 事务(含多数 DDL 语句),通过多版本并发控制(MVCC)避免锁竞争,提供防脏读和完全可序列化能力。它支持复杂 SQL 查询、多种索引类型、可更新视图、物化视图、触发器、外键,以及函数和存储过程,并拥有丰富的第三方扩展。此外,PostgreSQL 支持从其他数据库迁移,通过标准 SQL 兼容和迁移工具,甚至可通过内置或第三方扩展模拟专有数据库的特性(如 Oracle)。
@@ -1,15 +0,0 @@
## Docker安装
dockerhub网站:https://hub.docker.com/_/postgres
1. 拉取
```bash
docker pull postgres@18
```
2. 运行
```bash
docker run --name postgres18 -e POSTGRES_PASSWORD=xxx -p 5432:5432 -d postgres:18
```
> 初始化数据库:postgres 默认用户名:postgres
@@ -1,11 +0,0 @@
SQL Server 是微软推出的一款关系型数据库管理系统(RDBMS),主要用于存储、管理和处理结构化数据。
简单来说可以这样理解:
稳定可靠:常用于企业级应用,适合处理大量数据和高并发场景
功能全面:支持事务、索引、视图、存储过程、触发器等常见数据库功能
和微软生态集成好:和 Windows、.NET、Azure 等配合非常顺畅
易上手:自带管理工具(SSMS),对新手和运维都比较友好
@@ -1,200 +0,0 @@
## Windows系统
### 安装
**1**、登陆微软中国官网:[Microsoft - Official Home Page](https://link.zhihu.com/?target=https%3A//www.microsoft.com/zh-cn/);在搜索中输入 SQL Server 2008 并搜索。
![img](./assets/v2-7b64ed995472d681b150272e831bd06f_1440w.jpg)
下载链接:
[Download Microsoft® SQL Server® 2008 R2 SP2 - Express Edition from Official Microsoft Download Center](https://link.zhihu.com/?target=https%3A//www.microsoft.com/zh-CN/download/details.aspx%3Fid%3D30438)
**2**、下载
下载 64 位程序,如果系统是 32 位,就选 32 位的
![image-20250610210005234](./assets/image-20250610210005234.png)
这里只下载 **SQLEXPR_x64_CHS.exe** ,可视化工具选用 **Navicat**
**3**、安装
先安装SQL,再安装 SQL Management Studio
双击SQLEXPR_x64.CHS
![img](./assets/v2-a3b4eaa43750e31661f95cc1e25d7c55_1440w.jpg)
等待加载完毕
(这时会有一定的几率提醒你的电脑缺少[Microsoft .NET Framework 2.0](https://zhida.zhihu.com/search?content_id=102713512&content_type=Article&match_order=1&q=Microsoft+.NET+Framework+2.0&zd_token=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJ6aGlkYV9zZXJ2ZXIiLCJleHAiOjE3NDk3MzMwMzQsInEiOiJNaWNyb3NvZnQgLk5FVCBGcmFtZXdvcmsgMi4wIiwiemhpZGFfc291cmNlIjoiZW50aXR5IiwiY29udGVudF9pZCI6MTAyNzEzNTEyLCJjb250ZW50X3R5cGUiOiJBcnRpY2xlIiwibWF0Y2hfb3JkZXIiOjEsInpkX3Rva2VuIjpudWxsfQ.riy6QZKx3etA1Hd2g0oaCLoNl0G_pzuoq8tZqWZXfFo&zhida_source=entity) 或更高版本
根据他的提示进行安装就行)
![img](./assets/v2-21688a13be329ecf9efbdbc4040596a3_1440w.jpg)
如果没有,请忽略这一步。
当他顺利加载完毕之后,我们就可以看到下图所示的界面,**点击全新安装**
![img](./assets/v2-1688783d592ae41aa9fcf397867a2588_1440w.jpg)
![img](./assets/v2-4c7d6f2d930368d96ed646c8ef1e12c8_1440w.jpg)
接受并下一步
![img](./assets/v2-f3f22c97d8dfe77a9adb6811aa60dffe_1440w.jpg)
点击安装
一直下一步,保持默认设置到”实例配置“这一节,并选择”默认实例“,并点击下一步
![img](./assets/v2-34283637dc32b1e6623305be7194b3c6_1440w.jpg)
再一路下一步到”数据库引擎配置这一节“
![img](./assets/v2-9c9150dd6b42728ba18d001e08870058_1440w.jpg)
如果没有用户的话就点击”添加当前用户”
![img](./assets/v2-994ee12358e16a3c839030de71bb5fb0_1440w.jpg)
错误报告可选可不选
一直下一步直到安装完成
![img](./assets/v2-3c4a8588b5a2faca27dec12af7c99c4b_1440w.jpg)
到此为止,我们的安装过程已经进行完成了。 SQL Management Studio 可按照需求安装
### 配置
#### 服务
Windows 系统:`win` + `r` 输入 `services.msc` ,打开后找到 SqlServer 相关的,并将服务修改为自动,并且需要 首次 手动启动
![image-20250610210638276](./assets/image-20250610210638276.png)
![image-20250610210703831](./assets/image-20250610210703831.png)
#### 协议
`win` 键启动搜索,搜索 SQL Server 配置管理器
![image-20250610210833638](./assets/image-20250610210833638.png)
点击 SQL Server 配置管理器,确保该三个协议已启动,未启动则启动![image-20250610210952597](./assets/image-20250610210952597.png)
#### 端口
右键 TCP/IP
![image-20250610211035375](./assets/image-20250610211035375.png)
点击属性,修改 TCP 端口 为 1433
![image-20250610211139630](./assets/image-20250610211139630.png)
点击 应用 和 确认后,**重启电脑才能生效**
### 校验
**校验是否安装正确**
打开 **命令提示符**(Win + R,输入 `cmd`,回车)
Windows 上默认安装 SQL Server 的时候,通常会带有 `sqlcmd` 工具(如果没有,可能需要单独安装“命令行工具”)。
1. 打开 **命令提示符**(Win + R,输入 `cmd`,回车)
2. 输入以下命令连接本机默认实例:
```bash
sqlcmd -S localhost -E
```
参数说明:
- `-S localhost` :连接本机默认实例
- `-E` :使用 Windows 身份验证
3. 如果成功连接,你会看到类似如下提示:
```shell
1>
```
4. 在提示符后输入测试命令:
```sql
SELECT @@VERSION;
GO
```
然后按回车,输出当前 SQL Server 版本信息,证明连接成功。
5. 输入
```
QUIT
```
退出命令行界面。
### 启用混合模式认证(SQL Server 和 Windows 认证)
默认情况下,SQL Server 只开启 Windows 认证(Windows Authentication Mode),你需要手动开启“混合模式”(Mixed Mode Authentication),才能使用 SQL Server 账号(如 `sa`)登录。
1. 打开命令提示符,连接到 SQL Server:
```bash
sqlcmd -S localhost -E
```
2. 执行以下命令开启混合模式:
```sql
EXEC xp_instance_regwrite
N'HKEY_LOCAL_MACHINE',
N'Software\Microsoft\MSSQLServer\MSSQLServer',
N'LoginMode',
REG_DWORD,
2
GO
```
> 说明:`LoginMode` 设置为 `2` 表示混合模式,`1` 表示只 Windows 认证。
3. 重启 SQL Server 服务,使设置生效:
- 打开服务管理器,找到 `SQL Server (实例名)` 服务,点击“重启”或先停止再启动。
4. 启用 `sa` 账号并设置密码(默认可能禁用)
继续用 `sqlcmd` 执行:
```
ALTER LOGIN sa ENABLE;
GO
ALTER LOGIN sa WITH PASSWORD = '你的强密码';
GO
```
- **密码建议**:至少 8 位,包含大小写字母、数字和特殊符号。
5. 测试账号密码登录
- 使用 `sqlcmd`:
```bash
sqlcmd -S localhost -U sa -P 你的密码
```
- 连接成功即开启账号密码登录。
6. 额外说明
- 修改注册表和重启服务后才生效。
- 也可以用 PowerShell 或其他管理工具执行上述 SQL 命令。
- 强烈建议启用强密码,防止安全风险。
- 生产环境尽量避免启用 `sa`,建议创建新的 SQL 登录账号。
Binary file not shown.

Before

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 34 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 135 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 25 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 125 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 142 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 156 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 151 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 173 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 168 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 83 KiB

@@ -1,15 +0,0 @@
Docker 是一个 容器化平台,可以让你把应用程序和它运行所需的环境打包在一起,形成一个独立的“容器”。
简单来说,它就像一个轻量级的虚拟机,但比虚拟机更快、更省资源。
## 概念
1. 镜像(Image)
- 镜像是一个 只读模板,包含应用程序和依赖环境。
- 可以理解为应用的快照,像“配方”。
2. 容器(Container)
- 容器是镜像的 运行实例,可以启动、停止、删除。
- 可以理解为根据配方做出来的“饭菜”。
3. Dockerfile
- 用来定义镜像内容的文件,相当于“配方清单”。
- 里面写明了基础镜像、依赖、环境变量、运行命令等。
4. Docker Hub
- 官方提供的镜像仓库,可以下载别人已经打包好的镜像,也可以上传自己的镜像。
@@ -1,291 +0,0 @@
## 快速安装
轩辕提供的安装脚本:
```bash
bash <(wget -qO- https://xuanyuan.cloud/docker.sh)
```
> 参考网站:https://zhuanlan.zhihu.com/p/24461370776
## 脚本安装
### 对于基于Debian的系统(如Ubuntu、Debian)
```bash
#!/bin/bash
# -------------------------
# 1️⃣ 卸载旧版本 Docker
# -------------------------
sudo apt-get remove -y \
docker \
docker-engine \
docker.io \
containerd \
runc \
docker-ce \
docker-ce-cli \
containerd.io \
docker-compose-plugin
# 可选:清理残留数据(慎用,会删除容器和镜像)
# sudo rm -rf /var/lib/docker /var/lib/containerd
echo "旧版本 Docker 已卸载(如果存在)"
# -------------------------
# 2️⃣ 更新软件包列表并安装必要依赖
# -------------------------
sudo apt-get update
sudo apt-get install -y ca-certificates curl software-properties-common lsb-release
# -------------------------
# 3️⃣ 创建密钥存储目录
# -------------------------
sudo install -m 0755 -d /etc/apt/keyrings
# -------------------------
# 4️⃣ 下载Docker官方GPG密钥
# -------------------------
sudo curl -fsSL https://download.docker.com/linux/$(. /etc/os-release; echo "$ID")/gpg -o /etc/apt/keyrings/docker.asc
sudo chmod a+r /etc/apt/keyrings/docker.asc
# -------------------------
# 5️⃣ 添加 Docker 仓库
# -------------------------
if [ "$(lsb_release -is)" = "Ubuntu" ]; then
echo \
"deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.asc] https://download.docker.com/linux/ubuntu \
$(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
elif [ "$(lsb_release -is)" = "Debian" ]; then
echo \
"deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.asc] https://download.docker.com/linux/debian \
$(lsb_release -cs) stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
fi
sudo apt-get update
echo "Docker 仓库已添加。"
# -------------------------
# 6️⃣ 安装 Docker 及相关组件
# -------------------------
sudo apt-get install -y docker-ce docker-ce-cli containerd.io docker-compose-plugin
echo "Docker 安装完成 ✅"
```
### 对于基于RHEL的系统(如CentOS、RHEL)
```bash
#!/bin/bash
# -------------------------
# 1️⃣ 卸载旧版本 Docker
# -------------------------
sudo yum remove -y docker \
docker-client \
docker-client-latest \
docker-common \
docker-latest \
docker-latest-logrotate \
docker-logrotate \
docker-engine \
docker-ce \
docker-ce-cli \
containerd.io \
docker-compose-plugin
echo "旧版本 Docker 已卸载(如果存在)"
# -------------------------
# 2️⃣ 安装 yum 配置管理工具
# -------------------------
sudo yum install -y yum-utils
# -------------------------
# 3️⃣ 检测系统发行版并添加 Docker 仓库
# -------------------------
if [ -f /etc/centos-release ]; then
# CentOS 系统
sudo yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repo
elif [ -f /etc/redhat-release ]; then
# RHEL 系统
# 注意:RHEL 用户需要启用订阅管理仓库
sudo yum-config-manager --add-repo https://download.docker.com/linux/rhel/docker-ce.repo
else
echo "未识别的发行版,脚本退出。"
exit 1
fi
# -------------------------
# 4️⃣ 更新 yum 缓存
# -------------------------
sudo yum makecache fast
echo "Docker 仓库已添加。"
# -------------------------
# 5️⃣ 安装 Docker 及相关组件
# -------------------------
sudo yum install -y docker-ce docker-ce-cli containerd.io docker-compose-plugin
echo "Docker 安装完成 ✅"
```
### 通用脚本
```bash
#!/bin/bash
set -e
# -------------------------
# 1️⃣ 卸载旧版本 Docker
# -------------------------
remove_old_docker() {
if command -v apt-get >/dev/null 2>&1; then
sudo apt-get remove -y docker docker-engine docker.io containerd runc docker-ce docker-ce-cli containerd.io docker-compose-plugin || true
elif command -v yum >/dev/null 2>&1; then
sudo yum remove -y docker \
docker-client \
docker-client-latest \
docker-common \
docker-latest \
docker-latest-logrotate \
docker-logrotate \
docker-engine \
docker-ce \
docker-ce-cli \
containerd.io \
docker-compose-plugin || true
fi
echo "旧版本 Docker 已卸载(如果存在)"
}
# -------------------------
# 2️⃣ 安装 Docker(DEB 系统)
# -------------------------
install_docker_deb() {
local distro=$1
local codename=$2
sudo apt-get update
sudo apt-get install -y apt-transport-https ca-certificates curl software-properties-common lsb-release
sudo install -m 0755 -d /etc/apt/keyrings
sudo curl -fsSL "https://download.docker.com/linux/$distro/gpg" -o /etc/apt/keyrings/docker.asc
sudo chmod a+r /etc/apt/keyrings/docker.asc
echo "deb [arch=$(dpkg --print-architecture) signed-by=/etc/apt/keyrings/docker.asc] https://download.docker.com/linux/$distro $codename stable" | sudo tee /etc/apt/sources.list.d/docker.list > /dev/null
sudo apt-get update
sudo apt-get install -y docker-ce docker-ce-cli containerd.io docker-buildx-plugin docker-compose-plugin
sudo systemctl enable --now docker
}
# -------------------------
# 3️⃣ 安装 Docker(RPM 系统)
# -------------------------
install_docker_rpm() {
local distro=$1
if [ "$distro" = "fedora" ]; then
sudo dnf -y install dnf-plugins-core
else
sudo yum install -y yum-utils
fi
sudo yum-config-manager --add-repo "https://download.docker.com/linux/$distro/docker-ce.repo"
sudo yum makecache fast
sudo yum install -y docker-ce docker-ce-cli containerd.io docker-compose-plugin
sudo systemctl enable --now docker
}
# -------------------------
# 4️⃣ 主流程
# -------------------------
remove_old_docker
# 检测 Linux 发行版
if [ -f /etc/os-release ]; then
. /etc/os-release
else
echo "无法确定您的 Linux 发行版。"
exit 1
fi
case $ID in
ubuntu|debian|raspbian)
echo "检测到 $ID $VERSION_CODENAME,开始安装 Docker..."
install_docker_deb $ID $VERSION_CODENAME
;;
centos|rhel|fedora|sles)
echo "检测到 $ID,开始安装 Docker..."
install_docker_rpm $ID
;;
*)
echo "不支持的 Linux 发行版:$ID"
exit 1
;;
esac
echo "Docker 及 Docker Compose 安装完成 ✅"
```
### 运行脚本
```bash
# 1.创建脚本
vim docker-script.sh
# 2.输入内容 i 进行编辑模式, :wq 保存
# 3.赋予权限
chmod +x docker-script.sh
# 4.运行脚本
./docker-script.sh
```
## 镜像设置
不设置镜像会导致拉取速度非常慢
访问 https://api.suoyinmulu.com/open/v1/docker-hub/seeded-up/lists 获取最新的docker镜像,将 list 中的内容拷贝到 docker 中的 registry-mirrors 中。
```bash
sudo vim /etc/docker/daemon.json
```
```json
{
"registry-mirrors": [
// list
]
}
```
刷新:
```bash
sudo systemctl daemon-reload && sudo systemctl restart docker
```
## 问题
### 权限不足
1. 添加docker用户组(默认有)
```
sudo groupadd docker
```
2. 添加当前用户到docker组中
```
sudo gpasswd -a $USER docker
```
3. 更新用户组
```
newgrp docker
```
4. 重启生效 或 提前执行(建议重启)
```
sudo chown root:docker /var/run/docker.sock
```
Whitespace-only changes.
@@ -1,34 +0,0 @@
Docusaurus 是一个开源的静态网站生成器,专注于帮助开发者快速构建、部署和维护文档类网站。
> 官网:https://docusaurus.io/zh-CN/
## 优点
- 高度自定义:
- 使用 react 开发,并支持自定义扩展组件或自定义页面
- 提供 swizzle 命令可完全自定义布局
- 基础页面干净整洁,可快速捕捉到关键信息
- 社区群庞大,拥有广大的社区支持
- 同时支持 docs(文档) 和 blog(博客),能够有更多的选择
## 快速开始
### 1.环境要求
- Node版本最低 20
### 2.安装
```bash
npx create-docusaurus@latest my-website classic
```
如果需要支持 `typescript`,则使用
```bash
npx create-docusaurus@latest my-website classic --typescript
```
### 3.运行
下载依赖
```bash
pnpm i
```
运行项目
```bash
pnpm run start
```
@@ -1,35 +0,0 @@
默认的项目结构如下
```text
my-website
├── blog
│ ├── 2019-05-28-hola.md
│ ├── 2019-05-29-hello-world.md
│ └── 2020-05-30-welcome.md
├── docs
│ ├── doc1.md
│ ├── doc2.md
│ ├── doc3.md
│ └── mdx.md
├── src
│ ├── css
│ │ └── custom.css
│ └── pages
│ ├── styles.module.css
│ └── index.ts
├── static
│ └── img
├── docusaurus.config.ts
├── package.json
├── README.md
├── sidebars.ts
└── yarn.lock
```
目录介绍:
- `blog` - 存放博客文章,格式是 Markdown
- `docs` - 存放文档内容,也用 Markdown 格式
- `src` - 存放自定义的页面和样式。
- `static` - 存放自定义的页面和样式
- `docusaurus.config.ts` - 配置网站的各种信息
- `sidebars.ts` - 配置 docs 侧边栏的内容和结构
Loaded 100 of 150 files, more files were not shown because too many files have changed in this diff. Show more