Flutter如何创建并发布Plugin(VSCode+GitHub发布)

VS Code IDE 编辑器相对小众&＃xff1f;

相信采用 Android Studio 的直接创建 Flutter Plugin 都是由 IDE 直接辅助创建好全部的流程&＃xff0c;连 Example 的 run 动作都已经帮助配置好了。但本文是采用 VS Code 进行项目配置并运行&＃xff0c;整个流程先从命令行开始创建&＃xff0c;一步步的进行。

用过 VS Code 的同学发现她的界面非常简洁&＃xff0c;代码函数提示、搜索功能、调试运行快速直接。因我是老 iOS 开发从业8年有余&＃xff0c;使用 xcode 的人都会对在 Android Studio 编辑器中那大量无用的按钮而望而生畏&＃xff0c;其 Android Studio 的资源浪费、卡顿性让我无法接受。反观 VSCode&＃xff0c;其虽不是 google 的亲儿子&＃xff0c;有些“拐棍”还是需要用一用的。所以才有了这篇发布 Plugin 的分享。

选择 Flutter 的原因

我在开发《九排》的演艺界专业产品&＃xff0c;作为一个全新起步的手机客户端产品&＃xff0c;需要从一个能够看得足够长远的开发套件环境对其进行支持&＃xff0c;从2018年看到 Flutter 的正式版发布&＃xff0c;到2019年对整套 Widget 体系和 Dart 语言环境的深入了解和反复的开发测试、性能测试&＃xff0c;我认为 Flutter 对公司产品的将来有着良性推动和发展潜力。

本文的以创建《九排》App 脚手架开发工具包为范例讲解&＃xff0c;脚手架开发工具包在下方&＃xff1a;

github.com/maxcong/jpk…

一切的开始

Dart语言下包含有两种Package形态&＃xff1a;

第一种是 Dart Package&＃xff0c;她是一种没有 Android \ iOS 运行环境的纯 Dart 语言包

第二种是 Flutter Plugin&＃xff0c;她则是可以运行在 Android \ iOS 的 example 测试项目下插件工程

第一步&＃xff1a;创建 Plugin 项目文件

命令行创建 Flutter Plugin 需要打开控制台&＃xff0c;进入到具体希望创建包的目录输入以下命令&＃xff1a;

flutter create --org com.example --template&＃61;plugin plugin_name

其中 --org 指定的是你需要运行 example 的包标识符&＃xff0c;此主要运行在 Andoird 和 iOS 中&＃xff0c;而 iOS 中代表 bundle id 所指向的证书域。

后面的 --template&＃61;plugin 则是指定创建一个 Flutter plugin

创建好后&＃xff0c;可以用 VS Code 打开 Plugin 目录&＃xff0c;此时你会发现没有 Android Studio 的辅助&＃xff0c;我们很难去运行 Plugin 文件。这种情况下&＃xff0c;就要对整个项目工程目录有一个直观的理解&＃xff1a;

lib/plugin_name.dart
- 插件主入口
android/
- 用于在 Android 中实现的插件包API
ios/
- 用于在 iOS 中实现的插件包API
example/
- 一个依赖改插件的 Flutter 可运行程序&＃xff0c;主要是调试开发时使用&＃xff0c;我们主要用它

第二步&＃xff1a;VS Code中如何运行调试

首先用 VS Code 打开 Plugin 项目工程目录后&＃xff0c;IDE 会自动的在根目录创建一个隐藏目录&＃xff1a;.vscode/ &＃xff0c;这个目录下隐藏着一个 launch.json 文件&＃xff0c;我们主要来修改它。

打开 launch.json 文件可以看到自动创建的运行脚本&＃xff1a;

{"version": "0.2.0","configurations": [{"name": "Flutter""request": "launch","type": "dart"}] }

显然这套运行脚本不足以运行工程文件&＃xff0c;我们需要配置一下&＃xff0c;而配置的主要目标是要运行 example/lib/main.dart 入口文件。

修改 launch.json 进行配置&＃xff1a;

{"version": "0.2.0","configurations": [{"name": "Run Plugin","program": "example/lib/main.dart", // 修改此处"request": "launch","type": "dart"}] }

这样配置完毕&＃xff0c;就可以让 VS Code 具备运行能力&＃xff0c;我们可以对插件进行开发了。

正常的开发模式和普通的App的开发是完全一样的&＃xff0c;下一步就轮到发布 Plugin 了。这里由于 Plugin 的测试时间不希望发布到 pub 平台。那我们有的可选分支发布到 GitHub 上来调试。然后才是发布到 pub 平台。

第三步&＃xff1a;验证已经开发 Plugin 的错误

通过执行以下命令&＃xff0c;可以在命令行中对此包进行正确性验证&＃xff1a;

flutter packages pub publish --dry-run

发布分支1&＃xff1a;发布到 GitHub 上如何使用

我们可以正常的上传自己开发 Plugin 到自己的 GitHub 项目里&＃xff0c;并在本地 Push 最新的代码。但如果想要引用&＃xff0c;需要在自己的 App 开发项目中修改 pubspec.yaml 文件&＃xff0c;以让 packages 管理知道如何安装。修改如下&＃xff1a;

dependencies:jpkit:git: url: https://github.com/maxcong/jpkit.git

packages 管理对 pubspec.yaml 文件的缩进有严格要求。上面的代码配置告诉让 packages 管理指导 jpkit: 是从 git: 中获取&＃xff0c;指向了 url:

注意&＃xff1a;此处有如果频繁更新 GitHub 提交时&＃xff0c;可能有更新不下来的缓存问题&＃xff0c;我是通过等待一小会再次执行 flutter package get 得到最新结果。