Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

配置主题icon-url后 引用无效。。。或者是我不会引用 #2013

Closed
MinHongwei opened this issue Aug 18, 2018 · 6 comments
Closed

Comments

@MinHongwei
Copy link

我已经参考了 dxps/dvajs-user-dashboard#2
http://iconfont.cn/help/detail?spm=a313x.7781069.1998910419.d8cf4382a&helptype=code
https://github.com/ant-design/antd-init/tree/master/examples/local-iconfont

我的theme.js配置
// https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less
module.exports = {
// 'primary-color': '#10e99b',
'card-actions-background': '#f5f8fa',
'icon-url': '"https://at.alicdn.com/t/font_717533_2yiz9xidgt1"',
};
我的图标引用测试。
import React, { Component } from 'react';
import { Icon } from 'antd';
import styles from './index.less';

export default class app extends Component {
render() {
return (


asdasdadd



111





);
}
}

结果是一个图标都没有在页面出现、 我还是没能发现自己家的错误。 我能确定 配置的icon-url页面是有加载的,我通过 notwork 查看到了他

@ant-design-bot
Copy link

Translation of this issue:


After configuring the theme icon-url, the reference is invalid. . . Or I won't quote

I have referenced dxps/dvajs-user-dashboard#2
Http://iconfont.cn/help/detail?spm=a313x.7781069.1998910419.d8cf4382a&helptype=code
Https://github.com/ant-design/antd-init/tree/master/examples/local-iconfont

My theme.js configuration
// https://github.com/ant-design/ant-design/blob/master/components/style/themes/default.less
Module.exports = {
  // 'primary-color': '#10e99b',
  'card-actions-background': '#f5f8fa',
  'icon-url': '"https://at.alicdn.com/t/font_717533_2yiz9xidgt1"',
};
My icon references the test.
Import React, { Component } from 'react';
Import { Icon } from 'antd';
Import styles from './index.less';

Export default class app extends Component {
  Render() {
    Return (
      


        asdasdadd
        
        
        
        111
        
          
        
        
      

    );
  }
}

The result was that none of the icons appeared on the page, and I still couldn't find my home's mistake. I can be sure that the configured icon-url page is loaded, I checked him through notwork.

@MinHongwei
Copy link
Author

因为 我的图标测试发出来 会被git翻译。所有我将他们注释了
import React, { Component } from 'react';
import { Icon } from 'antd';
import styles from './index.less';

export default class app extends Component {
render() {
return (
//


// asdasdadd
//
//
//
// 111
//
//
//
//
//

);
}
}

@MinHongwei
Copy link
Author

@afc163
Copy link
Member

afc163 commented Aug 18, 2018

Please learn markdown format first. https://segmentfault.com/markdown

@MinHongwei
Copy link
Author

`import React, { Component } from 'react';
import { Icon } from 'antd';
import styles from './index.less';

export default class app extends Component {
render() {
return (

      <div>
        <font className={styles.test} >asdasdadd</font>
        <Icon type="tongzhi" />
        <Icon type="#icon-tongzhi" />
        <i className="iconfont icon-tongzhi" />
        111
        <svg className={styles.icon} aria-hidden="true">
          <use xlinkHref="#icon-tongzhi" />
        </svg>
        <Icon type="delete" />
      </div>
);

}
}
`

@MinHongwei
Copy link
Author

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

.test {
  color: red;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants