[icon] 在无公网环境下使用，默认添加的<script class="t-svg-js-stylesheet--unique-class" src="https://tdesign.gtimg.com/icon/0.1.4/fonts/index.js"></script> 会有一个请求错误

[zerlei]

tdesign-vue-next 版本

1.3.12

重现链接

无

重现步骤

1. 在无公网环境使用
2. TDesign 添加的一行 script 出现一个请求错误

<script class="t-svg-js-stylesheet--unique-class" src="https://tdesign.gtimg.com/icon/0.1.4/fonts/index.js"></script> 

期望结果

希望能有一个配置，不要添加这个script

实际结果

该script 无法取消

框架版本

3.3.4

浏览器版本

No response

系统版本

No response

Node版本

No response

补充说明

No response

[github-actions[bot]]

👋 @ZhaoYouYa，感谢给 TDesign 提出了 issue。 请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

[github-actions[bot]]

♥️ 有劳 @uyarn 尽快确认问题。 确认有效后将下一步计划和可能需要的时间回复给 @ZhaoYouYa 。

[uyarn]

目前这种使用方式就是会发起网络请求的 你的场景可以换成按需单个图标使用吗

[yixiaco]

我是用这种方式解决的，自己定义了一个组件

<template>
  <KeepAlive :max="100">
    <component :is="rowComponent" v-bind="$attrs" />
  </KeepAlive>
</template>
<script lang="ts">
export default {
  name: 'RIcon',
};
</script>
<script lang="ts" setup>
import * as Icons from 'tdesign-icons-vue-next/lib/icons';
import { computed } from 'vue';

const components = new Map();
Object.entries(Icons).forEach((value) => {
  // 将驼峰命名的组件名称转为横杠分割的组件名称，例如：Add12Icon => add-12-icon
  const componentName = value[0].replace(/([0-9]+|[A-Z])/g, (match, p1, offset) => {
    return offset === 0 ? p1.toLowerCase() : `-${p1.toLowerCase()}`;
  });
  components.set(componentName, value[1]);
});

const props = defineProps({
  name: {
    type: String,
  },
});

const rowComponent = computed(() => {
  if (!props.name) {
    return null;
  }
  return components.get(`${props.name}-icon`);
});
</script>

[zerlei]

感谢您的回复。

考虑到我是在无公网环境下使用,我使用icon是这样的方式

1. 如果事先确定icon。

<template>
  <add-icon />
  <my-svg />
</template>
<script>

import { AddIcon } from 'tdesign-icons-vue-next'
//使用vite,插件 svgloader
import MySvg from "@/assets/mysvg.svg"

</script>

2. 如果我并不能事先确定icon,但知道icon的范围,大致和您(@yixiaco )使用的方式一样

3. 如果icon 是一个我可以访问到的url地址(非公网),我可能会直接使用 <img src="./exampleurl.svg"/>,或者使用 tdesign的 <t-icon :url="./exampleurl.svg" />

我没有像下面这样使用icon:

<!-- 我知道这样需要公网,后续也不会这样使用 -->
<icon-font name="loading" />

对我而言，这个错误不会造成当没有公网环境时，图标无法显示的问题。只是严谨来说,当我不在公网环境使用时,该<script>可以不被添加。

[uyarn]

这个我在下个版本的图标上考虑支持下吧 这种问题相关的issue确实挺多的 transfer到icon仓库跟进

[github-actions[bot]]

👋 @ZhaoYouYa，感谢给 TDesign 提出了 issue。 请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

[zerlei]

这个我在下个版本的图标上考虑支持下吧 这种问题相关的issue确实挺多的 transfer到icon仓库跟进

感谢 感谢😀