Flutter 如何建立併發布 Plugin (VS Code + GitHub 發佈)

VS Code IDE 編輯器相對小衆？

      相信採用 Android Studio 的直接建立 Flutter Plugin 都是由 IDE 直接輔助建立好所有的流程，連 Example 的 run 動做都已經幫助配置好了。但本文是採用 VS Code 進行項目配置並運行，整個流程先從命令行開始建立，一步步的進行。

      用過 VS Code 的同窗發現她的界面很是簡潔，代碼函數提示、搜索功能、調試運行快速直接。因我是老 iOS 開發從業8年有餘，使用 xcode 的人都會對在 Android Studio 編輯器中那大量無用的按鈕而望而生畏，其 Android Studio 的資源浪費、卡頓性讓我沒法接受。反觀 VSCode，其雖不是 google 的親兒子，有些「柺棍」仍是須要用一用的。因此纔有了這篇發佈 Plugin 的分享。

選擇 Flutter 的緣由

      我在開發 《九排》的演藝界專業產品，做爲一個全新起步的手機客戶端產品，須要從一個可以看得足夠長遠的開發套件環境對其進行支持，從2018年看到 Flutter 的正式版發佈，到2019年對整套 Widget 體系和 Dart 語言環境的深刻了解和反覆的開發測試、性能測試，我認爲 Flutter 對公司產品的未來有着良性推進和發展潛力。

      本文的以建立《九排》App 腳手架開發工具包 爲範例講解，腳手架開發工具包在下方：

       github.com/maxcong/jpk…

一切的開始

      Dart語言下包含有兩種Package形態：

      第一種是 Dart Package，她是一種沒有 Android \ iOS 運行環境的純 Dart 語言包

      第二種是 Flutter Plugin，她則是能夠運行在 Android \ iOS 的 example 測試項目下插件工程

第一步：建立 Plugin 項目文件

      命令行建立 Flutter Plugin 須要打開控制檯，進入到具體但願建立包的目錄輸入如下命令：

flutter create --org com.example --template=plugin plugin_name複製代碼

      其中 --org 指定的是你須要運行 example 的包標識符，此主要運行在 Andoird 和 iOS 中，而 iOS 中表明 bundle id 所指向的證書域。

      後面的 --template=plugin 則是指定建立一個 Flutter plugin

      建立好後，能夠用 VS Code 打開 Plugin 目錄，此時你會發現沒有 Android Studio 的輔助，咱們很難去運行 Plugin 文件。這種狀況下，就要對整個項目工程目錄有一個直觀的理解：

• lib/plugin_name.dart
• 插件主入口
• android/
• 用於在 Android 中實現的插件包API
• ios/
• 用於在 iOS 中實現的插件包API
• example/
• 一個依賴改插件的 Flutter 可運行程序，主要是調試開發時使用，咱們主要用它

第二步：VS Code中如何運行調試

      首先用 VS Code 打開 Plugin 項目工程目錄後，IDE 會自動的在根目錄建立一個隱藏目錄：.vscode/ ，這個目錄下隱藏着一個 launch.json 文件，咱們主要來修改它。

      打開 launch.json 文件能夠看到自動建立的運行腳本：

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

      顯然這套運行腳本不足以運行工程文件，咱們須要配置一下，而配置的主要目標是要運行 example/lib/main.dart 入口文件。

修改 launch.json 進行配置：

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

      這樣配置完畢，就可讓 VS Code 具有運行能力，咱們能夠對插件進行開發了。

      正常的開發模式和普通的App的開發是徹底同樣的，下一步就輪到發佈 Plugin 了。這裏因爲 Plugin 的測試時間不但願發佈到 pub 平臺。那咱們有的可選分支 發佈到 GitHub 上來調試。而後纔是發佈到 pub 平臺。

第三步：驗證已經開發 Plugin 的錯誤

      經過執行如下命令，能夠在命令行中對此包進行正確性驗證：

flutter packages pub publish --dry-run複製代碼

發佈分支1：發佈到 GitHub 上如何使用

      咱們能夠正常的上傳本身開發 Plugin 到本身的 GitHub 項目裏，並在本地 Push 最新的代碼。但若是想要引用，須要在本身的 App 開發項目中修改 pubspec.yaml 文件，以讓 packages 管理知道如何安裝。修改以下：

dependencies:
    jpkit:
        git: 
            url: https://github.com/maxcong/jpkit.git複製代碼

      packages 管理對 pubspec.yaml 文件的縮進有嚴格要求。上面的代碼配置告訴讓 packages 管理指導 jpkit: 是從 git: 中獲取，指向了 url:

注意：此處有若是頻繁更新 GitHub 提交時，可能有更新不下來的緩存問題，我是經過等待一小會再次執行 flutter package get 獲得最新結果。

發佈分支2：發佈到 pub 平臺

      若是你認爲本身開發的 Plugin 的版本處於可發佈階段，那麼能夠發佈她到 pub.dartlang.org/ 平臺

flutter packages pub publish複製代碼

OK，至此已經將 Plugin 發佈到外網了，剩下的就是不停完善這個組件，以更好的融入到本身的產品工程文件當中，祝你好運。

本文的 Plugin 《九排》App 腳手架開發工具包

github.com/maxcong/jpk…