Fontanello 项目使用教程

Fontanello 项目使用教程

fontanelloBecause you have a weak spot for fonts项目地址:https://gitcode.com/gh_mirrors/fo/fontanello

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

Fontanello 项目的目录结构如下：

fontanello/
├── src/
│   ├── css/
│   ├── js/
│   ├── images/
│   └── manifest.json
├── LICENSE
├── README.md
└── .gitignore

目录介绍

• src/: 包含项目的源代码文件。
  • css/: 存放样式文件。
  • js/: 存放 JavaScript 文件。
  • images/: 存放图片资源。
  • manifest.json: 扩展的配置文件。
• LICENSE: 项目的开源许可证文件。
• README.md: 项目的说明文档。
• .gitignore: Git 忽略文件配置。

2. 项目的启动文件介绍

Fontanello 项目的启动文件主要是 manifest.json，它是 Chrome 扩展的配置文件，定义了扩展的基本信息和启动项。

manifest.json 文件内容示例

{
  "manifest_version": 2,
  "name": "Fontanello",
  "version": "1.3.0",
  "description": "A browser extension that lets you display the basic typographic styles of a text by right-clicking it.",
  "icons": {
    "16": "images/icon16.png",
    "48": "images/icon48.png",
    "128": "images/icon128.png"
  },
  "permissions": [
    "activeTab"
  ],
  "background": {
    "scripts": ["js/background.js"]
  },
  "browser_action": {
    "default_icon": "images/icon16.png",
    "default_popup": "popup.html"
  }
}

启动文件介绍

• manifest_version: 指定 manifest 文件的版本。
• name: 扩展的名称。
• version: 扩展的版本号。
• description: 扩展的描述。
• icons: 扩展的图标。
• permissions: 扩展所需的权限。
• background: 后台脚本配置。
• browser_action: 浏览器按钮的配置。

3. 项目的配置文件介绍

Fontanello 项目的主要配置文件是 manifest.json，它包含了扩展的基本信息和运行时所需的配置。

配置文件介绍

• manifest_version: 指定 manifest 文件的版本，通常为 2 或 3。
• name: 扩展的名称，显示在 Chrome 扩展管理页面。
• version: 扩展的版本号，用于更新和版本管理。
• description: 扩展的描述，帮助用户了解扩展的功能。
• icons: 扩展的图标，用于在扩展管理页面和浏览器按钮上显示。
• permissions: 扩展所需的权限，如访问当前标签页的权限。
• background: 后台脚本配置，指定后台运行的 JavaScript 文件。
• browser_action: 浏览器按钮的配置，包括图标和弹出页面。

通过以上配置，Fontanello 扩展可以在用户右键点击文本时，显示文本的基本排版样式信息。

fontanelloBecause you have a weak spot for fonts项目地址:https://gitcode.com/gh_mirrors/fo/fontanello