原生App项目集成flutter混合开发详细指南

记得去年9月份的时候谷歌在上海有一次开发者大会，去参加的时候关注到了flutter，随后没过多久就发布了1.0版本。18年底的时候用flutter做了个小项目，发现flutter确实挺好用的。于是尝试在公司找个小项目上马，进行混合开发试试。

方案选择

目前主流的混合开发方案有两种集成方式：

**源码集成：**也就是谷歌官方提供的方案[https://github.com/flutter/flutter/wiki/Add-Flutter-to-existing-apps]

**产物集成：**Flutter项目单独开发，开发完成后发布成aar包或者iOS的framework形式，原生项目依赖flutter输出的制品即可。具体可以参考闲鱼的文章

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-CcwHyVIK-1620884527395)(//upload-images.jianshu.io/upload_images/266795-e430038621ba3356.png?imageMogr2/auto-orient/strip|imageView2/2/w/1200/format/webp)]

两种方式各有优劣，其实产物集成更好一些，不过即使是进行产物集成，也需要弄懂源码集成的方式，因为当有很多和原生交互的功能进行开发的时候，源码集成的方式可以直接调试会方便很多。

根据目前我们的情况：

1.参与人员都要进行flutter开发、

2.持续发布和构建我可以修改控制

我们现在这个项目选择了源码集成的方式。

为原生项目集成flutter

整个的集成方案是参考谷歌方法：[https://github.com/flutter/flutter/wiki/Add-Flutter-to-existing-apps]，但是有一些不一样，我是创建了一个flutter项目后，在原生的项目中使用git submodule的形式进行管理的。

1.创建flutter module project

我们假定已经有了原生的项目Native-iOS和Native-Android；现在我们需要创建我们的flutter项目。

1. 把我们的flutter的channel切换到master(master分支下是flutter的preview版本)

   flutter channel master

2. 创建flutter模块的项目

   flutter create -t module {moduleName}

   我这里创建一个flutter的模块项目叫flutter_module

   ➜ flutter create -t module flutter_module
   Creating project flutter_module...
     flutter_module/test/widget_test.dart (created)
     ...
     ...
     flutter_module/.idea/workspace.xml (created)
   Running "flutter packages get" in flutter_module...                 7.2s
   Wrote 12 files.
   
   All done!
   Your module code is in flutter_module/lib/main.dart.
   
   

   创建成功后我们可以看一下目录结构

   ➜  flutter_module git:(master) ✗ tree -L 2 -a
   .
   ├── .android
   │   ├── Flutter
   │   ├── app
   │   ├── ...
   ├── .gitignore
   ├── .ios
   │   ├── Config
   │   ├── Flutter
   │   ├── ...
   │   └── Runner.xcworkspace
   ├── lib
   │   └── main.dart
   ├── pubspec.lock
   ├── pubspec.yaml
   └── test
       └── widget_test.dart
   
   

   在flutter的模块项目中包含有一个隐藏的.android和.ios目录这个目录下是可运行的Android和iOS项目，我们的flutter代码还是在lib下编写，注意在.android和.ios目录下都有一个Flutter目录，这个是我们flutter的库项目了。也就是Android用来生成aar，iOS用来生产framework的库。如果我们用flutter create xxx 生成的纯flutter项目是没有这个Flutter目录的。

3. 把该项目使用git管理起来ÿ