程序员

quasar Icon Genie CLI 自动生成图标 安装使用过程

作者:admin 2021-04-25 我要评论

使用背景 去年五六月份使用的quasar图标自动生成还是版本1的,版本1是Quasar App Extension,是要将其安装到项目文件夹中使用的,那时候用过,感觉这个很好用。 ...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

使用背景

去年五六月份使用的quasar图标自动生成还是版本1的,版本1是Quasar App Extension,是要将其安装到项目文件夹中使用的,那时候用过,感觉这个很好用。

今年的项目升级了quasar cli版本后,再去使用图标自动生成的时候,发现变成了Icon Genie CLI,升级了之后是全局安装的工具了。

使用过程步骤记录

按照文档Icon Genie CLI Installation 安装:

npm install -g @quasar/icongenie

发现报错。仔细阅读文档,发现有个友好提示:

安装这个提示,打开命令行,使用管理者权限安装windows-build-tools工具,具体安装命令可以查看 npm: windows-build-tools

之后打开项目,Icon Genie CLI Command List 按照命令运行icongenie 运行时,又遇到了报错:

Something went wrong installing the "sharp" module

具体报错如图:


(上图是引用@quasar/icongenie v2.3.0 released!这篇文中的,我遇到的也是同样报错,忘了截图就关掉了,解决问题之后报错无法出现了)

然后按照报错提示,打开命令行,使用管理者权限。在npm\node_modules\@quasar\icongenie项目中安装sharp:
sharp # High performance Node.js image processing

npm install sharp

安装之后,再次运行icongenie 命令,终于不报错了。

但是提示图片不存在:


从上图可以看到,使用icongenie verify时,它可以在public文件夹中正确找到之前生成的默认图标,那么应该是路径没写对。

icongenie verify 命令

使用icongenie verify也可以看到你项目使用的是何种模式,再根据 icongenie app-icons-list不同模式选用不同的命令。

icongenie generate 成功

最终:

icongenie generate -m spa -i public/app-icon.png

成功搞定:


本文转自网络,版权归原作者所有,原文链接:https://segmentfault.com/a/1190000039893380

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • quasar Icon Genie CLI 自动生成图标

    quasar Icon Genie CLI 自动生成图标

  • 基于 Flutter 的 Web 渲染引擎「北海」

    基于 Flutter 的 Web 渲染引擎「北海」

  • 前端常用图片文件下载上传方法

    前端常用图片文件下载上传方法

  • 阿里云日志服务(SLS)初体验

    阿里云日志服务(SLS)初体验

腾讯云代理商
海外云服务器