温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

Egret之Webp

发布时间:2020-06-28 15:29:32 来源:网络 阅读:1545 作者:Aonaufly 栏目:开发技术

在runtime2.0中已经加入了webp,但是需要运行于runtime加速器.如果想以H5网站的显示运行.目前需要加入第三方库.


一,使用 : npm install egret-resource-manager -g 安装最新RES(第三方)库

Egret之Webp


二,我新建了一个NewWebPDemo的GUI项目(其实EUI也行,没啥影响的)

在NewWebPDemo项目根目录执行 : res upgrade

Egret之Webp

编译之后 , 项目自动出现2处的不同:

1,bin文件夹下,新增了一个resourcemanager文件夹,该文件夹存放全新RES模块代码(第三方)。

2,egretProperties.json中,原有modules节点中的res节点被删除,取而代之的是名为resourcemanager的模块配置。


三,因为全新的RES模块(第三方)依赖于ES2015标准中的Promise对象,所以需要修改tsconfig.json文件如下:

{
   "compilerOptions": {
      "target": "es5",
      "experimentalDecorators":true,
     "lib": [
          "es5","dom","es2015.promise"
      ]
   },
   "exclude": [
      "node_modules"
   ]
}


四,利用DOS命令 : res build 你的项目名称  来重新构建你的项目资源. 在项目的平级目录(NewWebPDemo)所在目录

Egret之Webp

生成了一个config.json的文件


五,测试

利用智图软件将背景图片bg.jpg打成bg.webp替换到default.res.json中

另外加一个sheet图集json( 对应的图片为webp类型的 )

Egret之Webp

注意

Egret之Webp


测试代码 :

Egret之Webp


六,可完美加载与显示

Egret之Webp

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI