① react项目中使用svg
2.修改 package.json 启动方式
4.在项目根目录建立 config-overrides.js
5.在src目录下新建icons 文件夹,碰渣笑将svg文件存在该文件夹下
6.建立 src/icons/index.js
导入原理: 这里
8.编写svg组件
9.编写css
说明:addWebpackMoleRule() 方法笑含添加的新 loader 会放在 eslint loader 之后的 loader 的 oneOf 内的第一个,由于是 oneOf ,所以不必担心后面的 loader 影响该 svg ,该 svg 会被打包进 js 文件,动态挂载到 <body> 之下形成 <symbol>
1.执行eject
注意此操作不可逆
2.安装svg-sprite-loader
3.配置 /config/webpack.config.js (npm run eject后的配置 )
注意新添加的loader一定要放到file-loader之前
4.在src目录下新建icons 文件夹,将svg文件存在该文件夹下
5.建立梁困 src/icons/index.js
导入原理: 这里
7.编写svg组件
8.编写css
② 华为主题中的icons是啥文件
华为emotion ui的自带主题在内部存储/HWThemes文件夹里。扰友
查找方法:余嫌
1.打开自带文件管理器。
2.进入【本地】-【内部存储】。
3.安装字母顺序,找到H开头的HWThemes文件夹。
4.打开即可看到华为主题文件。竖李手
③ 初识WebExtensions
WebExtension是一个打包好的、可供发布的安装包,该安装包中包含若干文件,主要用于跨浏览器开发附加组件的工具。
火狐自45版本开始全面支持WebExtension开发浏览器扩展,并逐渐边缘化XPCOM 和 XUL,预计到2017年,WebExtension将成为火狐唯一合法的扩展开发方式。
用了火狐很多年,一直没了解过其扩展开发流程,这次正好简单熟悉一下。
WebExtension扩展必须包含一个名为manifest.json的文件,文件内包含有关扩展的基本元数据,例如它的名称,版本和它需要的权限。它也提供了指向扩展需要的其他文件。这也是之后通过about:debugging测试所需添加的唯一文件。
manifest.json可以指向以下几种类型的文件:
我们今天要做一个简单的插件,能实现以下功能:
1.在工具栏增加了一个新的按钮
2.当用户点击该按钮,我们会显示弹出使他们能够选择一种动物。
3.一旦他们选择的动物,我们将取代当前页面的与所选动物的图片内容。
根据需求,我们可以得出插件的结构图:
首先编写最重要的manifest.json文件
其中参数manifest_version,name和version这三个参数都是必填虚棚核的:
manifest_version 必填,值固定为2,额,你使用的版本就是第二代,总不能填3吧^ v ^
name 必填,是你插件的名字,这个随便你取,到时候显示在浏览器上的就是这个差掘名字
version 必填,是你插件的版本,看你自己的情况定。
description 选填,是对你插件功能的描述
icons 选填,是插件的图标,注意,这里定义的图标是显示在附加组件里面的,而不是工具栏上的,一般默认大小是48x48
permissions是设置列表权限的,这里我们只需要简单的actionTab功能即可
browser_action是对工具栏操作的具体描述:
default_icons 必填,展示在工具栏上的图标,一般大小为32x32
default_title 选填,鼠标悬停在图标上显示名字
default_popup用于点击插件按钮后展示的页面,在这里必填,如果只有一个和皮功能可以不填(即点击即用)
web_accessible_resources列出了我们要替换网页的文件,在这里必填
有了manifest.json文件后,我们就可以对所需文件进行一一配置。
在同目录下,创建beasts,icons,popup这三个文件夹,分别用于存放用于替换的动物图片,48和32两类插件图标和插件的操作界面
创建完后大概像这样:
动物图和图标就大家自己去弄了哈,把自己喜欢的图片添加进去就行了,但是注意哦,插件图标的大小是48和32两种格式哦,当然,在附加组件里面的图标可以使用96x96的。
这里我们再来说说popup这个文件,里面存放的就是我们插件的操作界面
你可以根据自己的喜好设计,因为只是测试,就怎么简单怎么来啦!我反正就用了简单的三个文件。
HTML文件看起来是这样的:
CSS加了点颜色和光标选择变化:
js则是点击选项后跳转到具体操作的脚本文件:
创建一个新的目录下的附加根,被称为“content_scripts”,并创建一个新的文件叫“beastify.js”,这个文件用于处理choose_beast.js传来的信息
这样就大概完成了这个插件,如果要测试可以在浏览器中输入:about:debugging
会出现以下界面:
点开临时加载附加组件然后选择manifest.json这个文件
如果想要其他人使用你的插件,你需要打包,并将其提交给Mozilla签名。有了证书之后,就可以和大家分享你的成果了!
本文的内容均根据Mozilla的官方教程而来,如果想要深入学习的,可以多花花时间去看看哦,附上链接:
https://developer.mozilla.org/en-US/
④ 魔兽世界icons文件夹是干嘛的
管理技能
物品图标的文件夹。属于游戏自腔租谨带文件夹。
不想游戏崩溃就型嫌不要碰他,
崩溃了也可以在
战网
里面修复伍基,如果你不嫌麻烦的话。
⑤ 电脑中的Icons文件夹是什么
放图标的文件
⑥ 我的C盘里有个文件夹icons,可以删吗
C:\Documents and Settings\TEMP 里面的都是临时文件,访问网页产生的。
还有那些可能是病毒,因为常规没念的TEMP文件1年才累积几G
建议1,你态察谨用优化大师 ,里面的 系统清帆基理
2,或者 重装系统。
⑦ iconsgroup是什么文件夹
可直接删除,不影响;缓存。不是C盘的文件,随便删除,没事。