Saya cuba memuatkan fail svg dan png sebagai laluan dari direktori /static/ untuk menggunakannya secara dinamik sebagai favicon.

Saya mengkonfigurasi semuanya mengikut dokumentasi:

./src/model/view/ ./static/ ./src/custom.d.ts ./tsconfig.json ./webpack.config.js ./package.json

Contoh Paparan BrowserView.ts

import FaviconPng daripada "../../../static/favicon_browser-32x32.png"; import FaviconSvg daripada "../../../static/favicon-browser.svg"; import { View } dari "./View"; kelas eksport BrowserView melaksanakan View { awam baca sahaja faviconPng = FaviconPng; awam baca sahaja faviconSvg = FaviconSvg; }

Pengisytiharan jenis tersuai custom.d.ts

istiharkan modul "*.svg" laluan const: string; eksport = laluan; } mengisytiharkan modul "*.png" laluan const: string; eksport = laluan; }

tsconfig.json

{ "Pilihan pengkompil" "esModuleInterop" "Penghias percubaan" "jsx" : "bertindak balas", "modulResolution" : "nod", "ketat" "sasaran" : "ES6" }, "termasuk" "./src/model/view/*", "./src/custom.d.ts" ] }

webpack.config.js

module.exports = { modul: { peraturan: [ { ujian: /.(jpe?g|png|svg)$/, gunakan: "url-loader" } ] } };

package.json mengandungi webpack dan url-loader.

但是我仍然遇到了这个错误：

RALAT dalam ./static/favicon_browser-32x32.png 1:0 Penghuraian modul gagal: aksara tidak dijangka '�' (1:0) Anda mungkin memerlukan pemuat yang sesuai untuk mengendalikan jenis fail ini, pada masa ini tiada pemuat dikonfigurasikan untuk memproses fail ini. Lihat https://webpack.js.org/concepts#loaders (Kod sumber ditinggalkan untuk fail binari ini) @ ./src/model/view/BrowserView.ts 1:0-68 7:26-36 @ ./src/App.tsx 34:0-69 73:33-51 162:17-40 224:17-40 @ ./src/index.tsx 4:0-32 5:36-41 RALAT dalam ./static/favicon_browser.svg 1:0 Penghuraian modul gagal: Token tidak dijangka (1:0) Anda mungkin memerlukan pemuat yang sesuai untuk mengendalikan jenis fail ini, pada masa ini tiada pemuat dikonfigurasikan untuk memproses fail ini. Lihat https://webpack.js.org/concepts#loaders >   @ ./src/model/view/BrowserView.ts 2:0-62 8:26-36 @ ./src/App.tsx 34:0-69 73:33-51 162:17-40 224:17-40 @ ./src/index.tsx 4:0-32 5:36-41

我猜测它无法识别加载器配置，但我不确定我可以改变什么。

private updateFavicon(view: View): void { // 通过id标签获取元素 const favicon_svg: HTMLElement = document.getElementById("favicon_svg")!; const favicon_png: HTMLElement = document.getElementById("favicon_png")!; // 设置图标 favicon_svg.setAttribute("href", view.faviconSvg); favicon_png.setAttribute("href", view.faviconPng); }