If you want to include static html in ReactJS. You need to use html-loader plugin if you are using webpack to serve your react code.
First of all you need to install html-loader plugin. Open your terminal and run following command:
npm install --save-dev html-loader
Then open your webpack configuration file and add following code:
{ modules: { loaders: [ { test: /\.html$/, loader: 'html-loader' } ] } }
Now, in your react code do following changes:
var htmlContent = require('path/to/html/file.html'); // or you can also write // import htmlContent from 'path/to/html/file.html'); export default function MyComponent() { return ( <div dangerouslySetInnerHTML={ {__html: htmlContent} } /> ); }
That is it. Now you can use static html files to load your html files in react.