vite-plugin-monkey 使用教程

1. 项目的目录结构及介绍

vite-plugin-monkey/
├── src/
│   ├── main.ts
│   ├── config.ts
│   └── ...
├── public/
│   └── index.html
├── vite.config.ts
├── package.json
└── README.md

• src/: 包含项目的源代码文件。
  • main.ts: 项目的入口文件。
  • config.ts: 项目的配置文件。
  • ...: 其他源代码文件。
• public/: 包含公共资源文件，如 index.html。
• vite.config.ts: Vite 的配置文件。
• package.json: 项目的依赖和脚本配置文件。
• README.md: 项目的说明文档。

2. 项目的启动文件介绍

main.ts

main.ts 是项目的入口文件，负责初始化项目和启动应用。以下是一个简单的示例：

import { createApp } from 'vue';
import App from './App.vue';

const app = createApp(App);
app.mount('#app');

3. 项目的配置文件介绍

vite.config.ts

vite.config.ts 是 Vite 的配置文件，用于配置项目的构建和开发服务器。以下是一个简单的示例：

import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import monkey from 'vite-plugin-monkey';

export default defineConfig({
  plugins: [
    vue(),
    monkey({
      entry: 'src/main.ts',
      userscript: {
        name: 'My Userscript',
        namespace: 'http://tampermonkey.net/',
        version: '1.0.0',
        description: 'My first userscript',
        author: 'Me',
        match: ['http://*/*', 'https://*/*'],
        grant: ['GM_addElement', 'GM_cookie'],
      },
    }),
  ],
});

config.ts

config.ts 是项目的配置文件，用于存储项目的配置信息。以下是一个简单的示例：

export const config = {
  apiUrl: 'https://api.example.com',
  timeout: 5000,
};

以上是 vite-plugin-monkey 项目的基本使用教程，涵盖了项目的目录结构、启动文件和配置文件的介绍。希望对你有所帮助！