React 项目使用iconfont symbol

作者: 青山白衣 | 来源:发表于2021-01-17 17:29 被阅读0次

在react项目的public目录下的index.html 中引入生成的代码
<script src="http://at.alicdn.com/t/font_2332037_31521kricse.js"></script>

image.png

在react项目的公共style文件中引入

  .icon {
    width: 1em; height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
 }

在react项目的组件中使用iconfont

  <svg className="icon" aria-hidden="true">
    <use xlinkHref="#icon-searcher"></use>
  </svg>

React 项目使用iconfont symbol
1. 在react项目的public目录下的index.html 中引入生成的代码 2. 在react项目的公共s...
vue cli3使用svg-sprite-loader
iconfont symbol对比svg-sprite-loader iconfont symbol在SVG使用上...
React Native 与 Iconfont
项目中因为不想使用小图标，打算使用iconfont,所以本文只要记录在React Nativ如何配置 React ...
day12
A我今天学习到了的 iconfont的使用图标管理我的项目添加入库 font-class引用 symbol引用
在 VUE 项目中使用 iconfont 的彩色图标
背景 iconfont 提供了彩色图标的使用，不过需要一些特别的处理。操作将项目生成的 symbol 代码复制...
iconfontのsymbol的使用
iconfontのsymbol的使用 iconfont三种方式的优缺点 unicode优点： 1.兼容性最好，支持...
react + webpack使用阿里iconfont，解决：图
问题使用 create-react-app 脚手架创建的项目，在使用iconfont时，一直不成功，效果显示为小...
react项目中使用iconfont
第一步：加入图表库，下载到本地第二步: 将解压后的文件夹放置在项目的src文件下，只需保留后缀为：eo...
React-Native solution
持续更新中...... React-Native使用自定义字体文件iconfont *.ttf 参考：React...
iconfont 彩色图标引入
1、demo 测试效果 2、在vue项目中引用 2.1 引入iconfont文件下面生成的 symbol 代码 i...