javascript - React SSR：在導入圖片時出現 SyntaxError：無效或意外的符號

我目前在嘗試導入圖片並將其加載到 src 屬性時遇到 [SyntaxError: Invalid or unexpected token]。這是程式碼：

import * as React from 'react';
import * as logo from '../../../../assets/logo.png';

export class EmailHeader extends React.Component { 
    render() { 
        return ( 
            <table style={{width: "100%"}}>
                <tbody>
                    <tr>
                        <td>
                            <img src={logo}></img> //this part throws an error
                        </td>
                        
                    </tr>
                </tbody>
            </table>
        )
    }
}

僅僅匯入 "logo" 沒有任何錯誤就能正常運作。但一旦我加上 src={logo}，就會拋出語法錯誤訊息。

React SSR 已經這樣設置了：

import * as ReactDOMServer from 'react-dom/server';
import { EmailHeader } from '../email/pages/EmailHeader';

///...
ReactDOMServer.renderToStaticMarkup(<EmailHeader/>)

我正在使用 Webpack 4 打包我所有的程式碼。任何幫助或建議都將非常有用！謝謝！

答案＃1

你可能需要配置你的 webpack。這裡有一個加載圖片文件的簡單方法。https://webpack.js.org/guides/asset-management/#loading-images

答案＃2

與其將圖片作為 * 導入，你可以這樣導入圖片—

import logo from '../../../../assets/logo.png';

我在我的專案中也使用相同的，它有效。
參考此答案以獲取更多細節 - 查看 Hawkeye Parker 的回答