# 移动端调试神器-eruda
**Repository Path**: fedocs/eruda
## Basic Information
- **Project Name**: 移动端调试神器-eruda
- **Description**: 移动端调试神器-eruda
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No
## Statistics
- **Stars**: 7
- **Forks**: 5
- **Created**: 2022-08-02
- **Last Updated**: 2025-09-08
## Categories & Tags
**Categories**: Uncategorized
**Tags**: None
## README
# vue-eruda
移动端 web 调试神器 - Eruda
## 效果预览
## 核心步骤
### 安装依赖
```sh
yarn add vite-plugin-html -D
# or
npm install vite-plugin-html -D
```
### 修改 vite 配置
- 编辑 `vite.config.ts` 文件，添加以下配置
```diff
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
+ import { createHtmlPlugin } from 'vite-plugin-html'
import vue from '@vitejs/plugin-vue'
// https://vitejs.dev/config/
+ export default defineConfig(({ mode }) => {
+ return {
plugins: [
vue(),
+ createHtmlPlugin({
+ inject: {
+ data: {
+ erudaScript:
+ mode !== 'production'
+ ? ``
+ : '',
+ },
+ },
+ }),
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
},
},
+ }
})
```
### 注入调试脚本
- 调试工具只会在 `yarn dev` 开发阶段生效，在 `yarn build` 构建打包阶段自动剔除。
```diff
移动端 web 调试神器 - Eruda
+ <%- erudaScript %>
```
## Demo 预览
### 安装依赖
```sh
yarn
```
### 启动项目
```sh
yarn dev
```
### 打包项目
```sh
yarn build
```