{"id":22061503,"url":"https://github.com/raojinlin/create-chrome-extension","last_synced_at":"2026-04-13T06:41:12.304Z","repository":{"id":195078637,"uuid":"692412587","full_name":"raojinlin/create-chrome-extension","owner":"raojinlin","description":"🤖 快速生成一个使用React和Ant Destign的Chrome扩展应用。","archived":false,"fork":false,"pushed_at":"2023-12-30T09:53:00.000Z","size":23,"stargazers_count":1,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-03-03T10:40:31.485Z","etag":null,"topics":["antd","chrome","chrome-extension","chrome-extension-react","create-chrome-extension","extension","react"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/raojinlin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-09-16T11:55:43.000Z","updated_at":"2024-05-12T08:25:18.000Z","dependencies_parsed_at":null,"dependency_job_id":"73acafcd-f55a-4e0a-bc9d-95cc1d2675a3","html_url":"https://github.com/raojinlin/create-chrome-extension","commit_stats":null,"previous_names":["raojinlin/create-chrome-extension"],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/raojinlin%2Fcreate-chrome-extension","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/raojinlin%2Fcreate-chrome-extension/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/raojinlin%2Fcreate-chrome-extension/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/raojinlin%2Fcreate-chrome-extension/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/raojinlin","download_url":"https://codeload.github.com/raojinlin/create-chrome-extension/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245138979,"owners_count":20567074,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["antd","chrome","chrome-extension","chrome-extension-react","create-chrome-extension","extension","react"],"created_at":"2024-11-30T18:12:42.186Z","updated_at":"2026-04-13T06:41:07.264Z","avatar_url":"https://github.com/raojinlin.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Create Chrome Extension\n\n\n`@raojinlin/create-chrome-extension`可以快速生成一个使用React和Ant Destign的Chrome扩展应用。\n\n[![asciicast](https://asciinema.org/a/608318.svg)](https://asciinema.org/a/608318)\n\n\n## 命令行参数\n\n```bash\nusage: index.js [-h] [-v] [-p PACKAGE] [-d DESCRIPTION] [-e EXTENSION_NAME] [-x EXTENSION_DESCRIPTION] project-directory\n\nCreate chrome extension\n\npositional arguments:\n  project-directory\n\noptional arguments:\n  -h, --help            show this help message and exit\n  -v, --version         show program's version number and exit\n  -p PACKAGE, --package PACKAGE\n                        Package name\n  -d DESCRIPTION, --description DESCRIPTION\n                        Package description\n  -e EXTENSION_NAME, --extension-name EXTENSION_NAME\n                        Extension name\n  -x EXTENSION_DESCRIPTION, --extension-description EXTENSION_DESCRIPTION\n                        Extension description\n\n```\n\n## 创建扩展应用\n1. 确保你的计算机上已经安装了Node.js的版本为16.0.0或更高版本。如果尚未安装，请访问Node.js官方网站（https://nodejs.org/）并按照指示安装。\n\n2. 打开终端或命令提示符，并使用以下命令创建一个新的Chrome扩展项目：\n\n```\nnpx @raojinlin/create-chrome-extension my-extension\n```\n\n这将使用npx工具创建一个名为\"my-extension\"的新Chrome扩展项目。\n\n或者使用参数一键创建Chrome扩展项目：\n\n```\nnpx @raojinlin/create-chrome-extension my-extension --package MyChromeExtension --description 'My Chrome extension' --extension-name 'My Chrome Extension' --extension-description 'My Chrome Extension Description' \n```\n\n3. 在项目目录中，你可以开始编写扩展代码。首先，进入项目目录：\n\n```\ncd my-extension\n```\n\n4. 创建你的React组件和扩展的其他页面。你可以在项目中的`src`目录中创建React组件，并根据需要创建其他页面。\n\n5. 修改Chrome扩展的清单文件（`src/manifest.[env].json`），以定义你的扩展的行为和设置。确保在清单文件中包括你的React页面。\n\n6. 构建你的React应用，以便将其包含在Chrome扩展中。使用以下命令构建React应用：\n\n```\nnpm run build\n```\n\n这将生成一个`extension`文件夹，其中包含了打包后的React应用。\n\n8. 最后，使用Chrome浏览器的开发者模式加载你的扩展。打开Chrome浏览器，转到扩展管理页面（chrome://extensions/），启用\"开发者模式\"，然后点击\"加载已解压的扩展\"并选择你项目中的`extension`文件夹。\n\n你的Chrome扩展应用现在应该加载并在浏览器中可用。你可以根据需要进一步自定义和配置扩展的功能和外观。\n\n请注意，这只是一个基本的创建Chrome扩展应用，具体的配置和功能取决于你的项目需求。你可能需要查阅Chrome扩展开发文档以深入了解如何定制你的扩展。\n\n\n另外，生成的代码使用```chrome-extension-react-antd-template```模板。关于代码的开发请参考：[README.md](https://github.com/raojinlin/chrome-extension-react-antd-template/blob/master/README.md)","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fraojinlin%2Fcreate-chrome-extension","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fraojinlin%2Fcreate-chrome-extension","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fraojinlin%2Fcreate-chrome-extension/lists"}