Je rencontre actuellement [SyntaxError: Jeton non valide ou inattendu] lorsque vous essayez d'importer une image et de le charger sur l'attribut SRC. Voici le code:
import * as ReactDOMServer from 'react-dom/server';
import { EmailHeader } from '../email/pages/EmailHeader';
///...
ReactDOMServer.renderToStaticMarkup(<EmailHeader/>)
4 Réponses :
Vous devez probablement configurer votre webpack. Voici un moyen facile de charger des fichiers image. https://webpack.js.org/guides/asset-management/# Loading-Images
au lieu d'importer une image comme J'utilise le même dans mon projet et ça marche. * Vous pouvez importer une image comme celle-ci-
Reportez-vous à cette réponse pour obtenir plus de détails -
Voir Hawkeye Parker Réponse
Vous devez créer un autre module de serveur pour le rendu SSR, COS Votre image et CSS sont emballés par WebPack telle que ceci: paquet.json
p>
import React from 'react';
import fs from 'fs';
import { StaticRouter } from 'react-router-dom';
import Main from '../src/container/main';
const render = require('../buildSsr/main').default;
const reactDomServer = require('react-dom/server');
console.log('server start ....');
console.log(render);
const useServerBuildFile = true;
let buildHtml;
module.exports = function(app) {
const routerArray = ['/', '/todo', 'about'];
routerArray.forEach((item) => {
if (useServerBuildFile) {
app.get(item, render);
} else {
app.get(item, (req, res) => {
const context = {};
const appHtml = reactDomServer.renderToString(
<StaticRouter location={ req.url } context={ context }>
<Main/>
</StaticRouter>,
);
if (!buildHtml) {
buildHtml = fs.readFileSync('./build/index.html', 'utf8');
}
let result = buildHtml.replace('#body', appHtml);
res.send(result);
});
}
});
};Installez le package NPM "File-Loader '.
import logo from '../../../../assets/logo.png';