引入nut-icon组件后构建报错：Module not found: Error: Can't resolve 'iconfont.woff?t=1668762221765'

[rocwong-cn]

NutUI scenes（nutui 场景）

H5（@nutui/nutui）

NutUI-vue version（nutui-vue 版本）

3.3.3

Vue version（vue 版本）

3.2.47

Operating environment（运行环境）

dev:h5

Citation method（引用方式）

npm

Node version（node 版本）

v14.18.1

Browser and its version（浏览器及其版本）

Chrome(108.0.5359.124)

System and its version（系统及其版本）

MacOs(11.3.1)

Reproduction link（重现链接）

github.com

Steps to reproduce（重现步骤）

clone代码后，执行：pnpm dev:h5

What is expected?（期望的结果是什么？）

不报错，可以正常使用nut-icon组件

What is actually happening?（实际的结果是什么？）

ERROR in ./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss (./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-17.use[0]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-18.use[0]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-20.use[1]!./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss) 5:36-94
Module not found: Error: Can't resolve 'iconfont.woff2?t=1668762221765' in '/workspaces/taro-3_5_12/node_modules/@nutui/nutui-taro/dist/packages/icon'
@ ./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss 2:26-362 53:4-74:5 56:18-354
@ ./src/app.ts 5:0-57
@ ./src/app.boot.js 3:0-30 45:19-28 46:25-34
@ ./src/app.config.ts 1:0-20

ERROR in ./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss (./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-17.use[0]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-18.use[0]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-20.use[1]!./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss) 6:36-93
Module not found: Error: Can't resolve 'iconfont.woff?t=1668762221765' in '/workspaces/taro-3_5_12/node_modules/@nutui/nutui-taro/dist/packages/icon'
@ ./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss 2:26-362 53:4-74:5 56:18-354
@ ./src/app.ts 5:0-57
@ ./src/app.boot.js 3:0-30 45:19-28 46:25-34
@ ./src/app.config.ts 1:0-20

ERROR in ./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss (./node_modules/@tarojs/webpack5-runner/node_modules/css-loader/dist/cjs.js??clonedRuleSet-17.use[0]!./node_modules/@tarojs/webpack5-runner/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-18.use[0]!./node_modules/resolve-url-loader/index.js!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-20.use[1]!./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss) 7:36-92
Module not found: Error: Can't resolve 'iconfont.ttf?t=1668762221765' in '/workspaces/taro-3_5_12/node_modules/@nutui/nutui-taro/dist/packages/icon'
@ ./node_modules/@nutui/nutui-taro/dist/packages/icon/index.scss 2:26-362 53:4-74:5 56:18-354
@ ./src/app.ts 5:0-57
@ ./src/app.boot.js 3:0-30 45:19-28 46:25-34
@ ./src/app.config.ts 1:0-20

[rocwong-cn]

[richard1015]

解决方案 ： 先降级 Taro 3.5.11

经测试排查 3.5.11 没问题， 对比了3.5.11 changelog 发现 下列 提交 可能会影响 iconfont 字体加载异常

NervJS/taro@a311d11

Taro 团队跟进 @Chen-jj

[yoyo837]

也可以先将iconfont.css挪到app.js加载绕过.

[yoyo837]

感觉之前修复过一次

[Chen-jj]

Taro v3.6.2 修复