如何使用 Flutter 构建 Chrome 扩展？
Men*_*elG 13 html google-chrome dart flutter
我接触到使用 Flutter 框架创建 Chrome 扩展的想法。虽然我有 Flutter 应用程序开发经验，但我对 Chrome 扩展的世界还相当陌生。我听说可以使用 Flutter 构建 Chrome 扩展，但我不确定所涉及的步骤。
我尝试过的
说实话，我在这方面是从零开始的。我还没有尝试过任何事情，因为我不知道从哪里开始。我的 Flutter 知识相当扎实，但我不确定如何将其用于构建 Chrome 扩展。
我还看了官方文档。但是，我找不到任何资源。
具体来说，我不确定：
如何构建 Flutter 项目以充当 Chrome 扩展？具体来说：项目文件（例如， index.html、manifest.json ）需要进行哪些修改才能启用扩展功能？
Men*_*elG 18
确保您拥有最新版本的 Flutter。
\n要将 Web 支持添加到使用早期版本的 Flutter 创建的现有项目，请从项目\xe2\x80\x99s 顶级目录运行以下命令：
\nflutter create --platforms web .\n设置
\n1.修改index.html：
\n导航到该web/index.html文件以删除任何不支持的脚本：
- \n
<script>在标签内插入以下标签<body>： \n
flutter create --platforms web .\n设置扩展视图尺寸：
\n通过修改web/index.html<html>中的起始标签来定义扩展视图的固定尺寸：
<script src="main.dart.js" type="application/javascript"></script>\n您的修改index.html现在应该如下所示：
<html style="height: 600px; width: 350px">\n2.修改manifest.json：
\n将文件内容替换web/manifest.json为适当的扩展配置，包括名称、描述、版本、内容安全策略、默认弹出窗口和图标：
<!DOCTYPE html>\n<html style="height: 600px; width: 300px">\n<head>\n <meta charset="UTF-8" />\n <title>chromextension</title>\n</head>\n<body>\n<script src="main.dart.js" type="application/javascript"></script>\n</body>\n</html>\n构建扩展
\n使用 HTML 渲染器和--csp禁用动态代码生成的标志生成 Flutter Web 构建：
flutter build web --web-renderer html --csp\n（每次更改代码时，都应该重建扩展）。
\n安装并测试扩展
\n- \n
打开 Chrome 并
\nchrome://extensions在 URL 地址栏中输入。 \n启用开发者模式。
\n \n单击“加载解压的文件”并选择
\n<flutter_project_dir>/build/web文件夹。（再次选择build /web 文件夹） \n
现在，该扩展程序将被安装并可从 Chrome 扩展栏访问：
\n
| 归档时间： |
|
| 查看次数： |
1277 次 |
| 最近记录： |