Estoy tratando de importar un archivo HTML (.html) en react js - mecanografiado (.tsx) como componente
pero me da este ERROR:
error - ./pages/SM_login/Facebook.html Error al analizar el módulo: Token inesperado (1:0) Es posible que necesite un cargador apropiado para manejar este tipo de archivo, actualmente no hay cargadores configurados para procesar este archivo. Consulte https://webpack.js.org/concepts#loaders
| |
Aquí está mi código:
const facebook = require('./SM_login/facebook.html'); export default class CustomDocument extends Document { render() { return ( <div> <li> <iframe src={facebook }></iframe> </li> </div> ); }}
Dentro de su archivo ./SM_login/facebook.html , envuelva todo el código dentro de un acento grave (``) y nombre esta cadena con un nombre de variable como iframeCode
export default iframeCode = `<html>...</html>` cambie el nombre de su facebook.html a facebook.ts
dentro de su código, siga con dangerouslySetInnerHTML
import facebook from './SM_login/facebook.ts' export default class CustomDocument extends Document { render() { return ( <div> <li> <div dangerouslySetInnerHTML={{__html: facebook}} /> </li> </div> ); }De acuerdo con la documentación de reacción, no puede importar un módulo usando la palabra clave require , debe usar la palabra clave es6, importar su código debería ser así
import facebook from "./facebook.html"; const CustomDocument = () => { return ( <div> <li> <iframe src={facebook}></iframe> </li> </div> ); } export default CustomDocument;