gol*_*nge 5 javascript parcel reactjs server-side-rendering parceljs
我正在尝试使用简单的快速服务器运行 SSR React (16.3.0) 应用程序。构建并运行后babel-node server.js出现有关导入 PNG 文件的错误:
/home/dev/test/src/assets/bg.png:1\n(function (exports, require, module, __filename, __dirname) { \xef\xbf\xbdPNG\n ^
\n\nSyntaxError: Invalid or unexpected token\n at createScript (vm.js:80:10)\n at Object.runInThisContext (vm.js:139:10)\n at Module._compile (module.js:617:28)\n at Module._extensions..js (module.js:664:10)\n at Object.newLoader [as .js] (/home/dev/test/node_modules/pirates/lib/index.js:88:7)\n at Module.load (module.js:566:32)\n at tryModuleLoad (module.js:506:12)\n at Function.Module._load (module.js:498:3)\n at Module.require (module.js:597:17)\n at require (internal/module.js:11:18)\nRun Code Online (Sandbox Code Playgroud)\n\n这是我的 server.js:
\n\nimport express from \'express\'\nimport React from \'react\'\nimport ReactDOMServer from \'react-dom/server\'\nimport path from \'path\'\n\nimport App from \'./src/components/App\'\n\nconst app = express()\nconst port = 4000\n\nconst HTMLShell = (html) => `\n <!DOCTYPE html>\n <html>\n <head>\n <meta charset="utf-8">\n <meta name="viewport" content="width=device-width, initial-scale=1">\n <title>SSR React App</title>\n </head>\n <body>\n <div id="app">${html}</div>\n <script src="./app.min.js"></script>\n </body>\n </html>`\n\napp.use(express.static(path.join(__dirname, \'dist\')))\n\napp.get(\'*\', (req, res) => {\n let html = ReactDOMServer.renderToString(\n <App />\n )\n\n res.send(HTMLShell(html))\n})\n\napp.listen(port, () => console.log(`Example app listening on port ${port}!`))\nRun Code Online (Sandbox Code Playgroud)\n\n对于捆绑,我正在使用 Parcel。如何导入图像而不出现此错误?
\n\n编辑:\n图像以这种方式导入:
\n\nimport bgHeader from \'../assets/bg.png\'