根据pubspec.yaml中设置的目录模板自动向其中添加文件记录的简单脚本
Branch: master
Clone or download
debuggerx01 Update asset_generator.dart
修正windows下获取到的文件路径分隔符为反斜杠而导致的一系列问题
Latest commit 7c3d686 Oct 15, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
raw Add files via upload Jun 6, 2018
LICENSE Initial commit May 29, 2018
README.md Update README.md Jun 6, 2018
asset_generator.dart Update asset_generator.dart Oct 14, 2018

README.md

更新(2018-06-03)

向生成的r.dart资源文件中增加了图片预览功能,可以在ide中选择资源时通过快捷键显示预览(as/idea默认为Ctrl+q),效果如下: 由于注释中md格式图片引用不支持本地路径,所以是利用了脚本开启了一个本地文件服务器,如果出现端口冲突可以自行修改脚本中第7行 preview_server_port 的值即可。

更新(2018-05-30)

由于官方工具升级,现在已经支持直接在 pubspec.yaml 中填写文件夹并自动扫描添加其中的资源文件了,参考:
https://flutter.io/assets-and-images/
Scan assets from disk #16413
可以采用这种方式来代替刷新脚本了。
不过利用脚本中生成 r.dart 资源文件方便在代码中引用的功能仍然是有意义的……

asset_generator

根据pubspec.yaml中设置的目录模板自动向其中添加文件记录的简单脚本

效果演示

安装方法

  1. 下载 asset_generator.dart 脚本文件
  2. 找到自己flutter的安装目录,将脚本放在flutter的根目录下(可选,推荐)
  3. 根据使用的IDE不同,为其设置调用命令

为IDE设置脚本运行命令

idea/Android Studio

  1. 打开设置界面,找到外部工具设置项 ( Tools -> ExternalTools ):
  2. 点击添加按钮,参考下图配置: 其中名称简介均可随意设置,Program 项需要设置为 flutter 目录内下载的 dart 命令的绝对路径;
    Arguments 项需要设置为安装方法中下载脚本放置位置的绝对路径;
    Working directory 项需要填 $ProjectFileDir$ , 以确保脚本能在工程中以正确的路径执行

vscode

  1. 创建项目后,选择 [任务] -> [配置任务] :

2.选择从模板创建任务后,在下面的选项中选择最后一项 (Others 运行任意外部命令的示例)

3.按照下图配置调用命令,需要注意 dart 命令脚本的实际路径, 名称随意:

4.修改好 pubspec.yaml 文件后,可以通过 [任务]->[运行任务],然后根据上一步配置的名称运行命令:

5.命令运行后可以在底部终端显示栏中切换查看,点击垃圾桶图标可以停止脚本运行:

使用方法

编辑 pubspec.yaml 文件,在需要脚本处理的位置加入如下格式的注释:

# assets begin
# images/*
# assets end

脚本只会处理 '# assets begin' 与 '# assets end' 之间的模板,这样可以避免误删除其他配置信息 加入目录的格式为 '# <目录名>/*' ,脚本将在此注释下面将遍历出的文件依次添加。

接着根据使用的IDE不同调用脚本运行命令。

处理完成后还会在 lib/ 目录中自动生成r.dart 文件,并按照规范的命名格式生成资源文件路径的静态常量,推荐代码中使用资源时使用 R.xxx 的方式传地址,可以避免手误写错路径的尴尬。