使用 Node.js 脚本下载阿里图标库并集成到 Flutter 项目/n/n本文提供一个 Node.js 脚本,用于自动下载阿里云图标库的压缩包,解压缩并生成 Flutter 项目所需的图标文件和代码。脚本可以根据参数设置输出目录和图标资源路径,方便集成到项目中。/n/n### 需求/n/n1. 下载阿里云图标库的文件。/n2. 将文件解压出来。/n3. 将解压出来的 ttf 文件放到指定目录下。/n4. 根据解压文件中的 html 文件生成对应的 dart 文件。/n5. 将上面的关键变量提出来,可以在调用 js 的时候通过命令行的方式传入上面的变量。/n6. 追加 tff 资源文件路径到 pubspec.yaml 文件下内容:/n/n### 解决方案/n/n以下是一个可能的解决方案,需要安装 request, adm-zip, cheeriofs-extra 这些 npm 包:/n/njavascript/nconst request = require('request');/nconst AdmZip = require('adm-zip');/nconst cheerio = require('cheerio');/nconst fs = require('fs-extra');/n/n// 命令行参数/nconst args = process.argv.slice(2);/nconst iconfontUrl = args[0]; // iconfont 的下载链接/nconst outputDir = args[1]; // 输出目录/n/n// 下载 iconfont/nrequest.get(iconfontUrl, (error, response, body) => {/n if (error) {/n console.error('下载失败:', error);/n return;/n }/n // 解压 iconfont/n const zip = new AdmZip(Buffer.from(body));/n zip.extractAllTo(outputDir, true);/n/n // 读取 html 文件,提取 icon 列表/n const html = fs.readFileSync(`${outputDir}/demo_index.html`, 'utf8');/n const $ = cheerio.load(html);/n const icons = [];/n $('symbol').each((i, el) => {/n const name = $(el).attr('id').replace('icon-', '');/n const path = $(el).find('path').attr('d');/n icons.push({ name, path });/n });/n/n // 生成 dart 代码/n const dartCode = `class IconFont {/n IconFont._();/n/n ${icons.map(icon => `static const IconData ${icon.name} = IconData(0x${icon.path}, fontFamily: _fontFamily);`).join('/n')}/n/n static const String _fontFamily = 'iconfont';/n }`;/n/n // 写入 dart 文件/n fs.writeFileSync(`${outputDir}/iconfont.dart`, dartCode);/n/n // 追加 tff 资源路径到 pubspec.yaml 文件下/n const pubspecFile = `${process.cwd()}/pubspec.yaml`;/n const pubspecContent = fs.readFileSync(pubspecFile, 'utf8');/n const newContent = pubspecContent.replace(/(fonts:/s*$[/s/S]*)/, `$1/n - family: iconfont/n fonts:/n - asset: ${outputDir}/iconfont.ttf`);/n fs.writeFileSync(pubspecFile, newContent);/n/n console.log('完成');/n});/n/n/n### 使用方式/n/nbash/nnode download-iconfont.js https://at.alicdn.com/t/font_1234567_abcd.zip ./assets/iconfont/n/n/n其中,第一个参数是 iconfont 的下载链接,第二个参数是输出目录。脚本会在输出目录下生成 iconfont.ttficonfont.dart 文件,并在 pubspec.yaml 文件中追加相应的资源路径。

使用 Node.js 脚本下载阿里图标库并集成到 Flutter 项目

原文地址: https://www.cveoy.top/t/topic/ly2z 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录