react-static-page-webpack-plugin
v1.2.1
Published
A webpack that generates an html page from a react component
Downloads
29
Readme
ReactStaticPageWebpackPlugin
A webpack that generates an html page from a react component
Usage
yarn add react-static-page-webpack-plugin -D
webpack.config.js
exports = {
entry './src/static-page.js',
output: {
libraryTarget: 'commonjs'
}
plugins: [
new ReactStaticPageWebpackPlugin({
fileName: 'static-index.html',
title: 'My Page Title',
props: {
customerName: 'Sally'
}
}),
],
};
And in ./src/static-page.js
:
import React from 'react';
export default function StaticPage({ customerName }) {
return <main>Hi there: {customerName}</main>;
}
When running the webpack build static-index.html
will be written to your output folder.
Options
chunk
: Specific the entry chunk that returns the body component you want to render, optional, will use the first chunk when omittedfileName
: The output file nametitle
: A page title placed in teh<head>
meta
: a string of meta tags placed into the document<head>
props
: An set of props that is passed to your component.
Why use a webpack chunk?
The reason we use an entry chunk (instead of providing a filename to the component) is so you can leaverage your existing webpack config for styling, and compilation.