在使用 npm 運行構建運行 reactjs 項目時，出現錯誤--postcss-svgo: Error in parsing SVG: Attribute without value

Question

代碼在 npm 啟動時工作正常。 但是在 npm-run-build 上運行時，顯示以下錯誤：

react-scripts build
Creating an optimized production build...
Failed to compile.
postcss-svgo: Error in parsing SVG: Attribute without value
Line: 0
Column: 60
Char: d
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! matchtimings@0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the matchtimings@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

錯誤截圖：

Answer 1

當我們在代碼中的某處以編碼格式使用 svg 數據 URI 時，可能會出現這種錯誤，例如 background-image: url('data:image/svg xml...)。

因此，只需使用任何在線 URL 編碼器/解碼器（ URI 解碼器）對編碼的 svg URI 內容進行解碼，並在其中替換解碼后的 svg 內容

例如：

編碼的 URI

background-image: url('data:image/svg+xml,%3csvg xmlns=http://www.w3.org/2000/svg width=12 height=12 fill=none stroke=%23dc3545 viewBox=0 0 12 12%3e%3ccircle cx=6....');

解碼的 URI

background-image: url('data:image/svg xml,<svg xmlns=http://www.w3.org/2000/svg width=12 height=12 fill=none stroke=#dc3545 viewBox=0 0 12 12>......</svg>');