随着3月4日flutter2.0的发布，flutter web也迎来的稳定版，以前想要打包flutter web项目要先切换flutter channel ，再 flutter upgrade ，非常麻烦，现在就非常方便了，直接在同一channel下就可以打包android、ios、web等项目，只想说真香，

由于不同系统有些功能不一样，所以就需要针对不同的项目做插件适配，今天就煎蛋记录一下怎么开发flutter插件

1.新建插件项目，这里使用AndroidStudio

新建插件项目

2.给插件命名以及描述等

命名

看下插件项目的目录结构

结构

插件声明代码

class CashotPlugin {

    static const MethodChannel _channel = const MethodChannel('cashot_plugin');

    static Future<String> get platformVersion async {

            final String version = await _channel.invokeMethod('getPlatformVersion');

            return version;

    }

    ///人脸sdk初始化

    static Future<void> init(String key, String secrit) async {

            await _channel .invokeMethod("liveness_init", {"args1": key, "args2": secrit});

    }

}

4.android插件

仿照自动生成的代码，完善自己的自定义插件就ok了，没有什么难度

android

5web插件

首先要配置一下插件位置

我们再lib目录下新建web文件夹，然后新建web_plugin.dart文件，然后在pubspec.yaml配置文件里配置插件信息，默认是没有的，如下

配置

web插件

我们可以在web_plugin.dart文件里做一些flutter和js的交互

首先要导入dart:js这个包

import 'dart:js' as js;

//flutter调用js的console.log('xxx');方法

js.context['console'].callMethod('log', call.arguments);

//flutter 调用alert

js.context.callMethod("alert",["暂不支持"]);

格式如下：

js.context['对象'].callMethod('方法名', 数组参数);

js调用flutter代码分两步：1.声明flutter函数。2，绑定js方法

js.context["flutterMethod"]=(params){

    //do any dart method

};

在js里直接调用flutterMethod就可以了

flutterMethod("xxxx");

此文章主要是自己记录用，有些地方随便写的，后续再补充。