Insight 项目使用教程

Insight 项目使用教程

insight 项目地址: https://gitcode.com/gh_mirrors/insi/insight

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

Insight 项目的目录结构如下：

insight/
├── build/
│   └── build.sh
├── src/
│   ├── content_script_init.js
│   └── ...
├── static/
│   └── ...
├── .gitignore
├── CONTRIBUTING.md
├── LICENSE.md
├── README.md
├── cloc.sh
└── manifest.json

目录结构介绍

• build/: 包含项目的构建脚本 build.sh，用于将源文件合并并复制到剪贴板。
• src/: 包含项目的源代码文件，如 content_script_init.js 等。
• static/: 包含项目的静态资源文件。
• .gitignore: 指定 Git 版本控制系统忽略的文件和目录。
• CONTRIBUTING.md: 贡献指南，指导开发者如何为项目做出贡献。
• LICENSE.md: 项目的开源许可证文件，本项目使用 MIT 许可证。
• README.md: 项目的自述文件，包含项目的概述、安装和使用说明。
• cloc.sh: 用于统计代码行数的脚本。
• manifest.json: Chrome 扩展的配置文件，定义扩展的行为和权限。

2. 项目的启动文件介绍

Insight 项目的启动文件主要是 manifest.json 和 content_script_init.js。

manifest.json

manifest.json 是 Chrome 扩展的配置文件，定义了扩展的基本信息、权限、启动方式等。以下是 manifest.json 的部分内容：

{
  "name": "WebGL Insight",
  "version": "1.0.3",
  "description": "A helpful Chrome extension for WebGL development",
  "permissions": [
    "activeTab",
    "webRequest",
    "webRequestBlocking",
    "http://*/*",
    "https://*/*"
  ],
  "background": {
    "scripts": ["background.js"],
    "persistent": true
  },
  "devtools_page": "devtools.html",
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content_script_init.js"]
    }
  ],
  "web_accessible_resources": [
    "static/*"
  ],
  "manifest_version": 2
}

content_script_init.js

content_script_init.js 是 Insight 项目的主要启动脚本，负责在页面加载时注入代码，启动 WebGL 调试工具。

3. 项目的配置文件介绍

Insight 项目的主要配置文件是 manifest.json，它定义了扩展的行为和权限。以下是 manifest.json 的部分配置项介绍：

• name: 扩展的名称，显示在 Chrome 扩展管理页面。
• version: 扩展的版本号，用于版本管理和更新。
• description: 扩展的描述，简要介绍扩展的功能。
• permissions: 扩展所需的权限，如访问网页内容、拦截网络请求等。
• background: 定义后台脚本，background.js 负责处理扩展的后台逻辑。
• devtools_page: 定义 DevTools 页面，devtools.html 是 DevTools 面板的入口。
• content_scripts: 定义内容脚本，content_script_init.js 会在匹配的网页中注入并执行。
• web_accessible_resources: 定义可访问的资源，如静态文件。
• manifest_version: 指定 manifest 文件的版本，当前为版本 2。

通过以上配置，Insight 扩展能够在 Chrome 浏览器中提供强大的 WebGL 开发调试功能。

insight 项目地址: https://gitcode.com/gh_mirrors/insi/insight