From 723864374059714118314c2a54ca9e8c738d290b Mon Sep 17 00:00:00 2001 From: Jeff Avallone Date: Tue, 13 Feb 2018 17:10:32 -0500 Subject: [PATCH] Reworking static page generation Including styles in components wasn't working with the old system. --- .babelrc | 2 +- .gitignore | 1 + package.json | 7 ++- src/components/App.js | 8 +-- src/pages/404/{index.js => browser.js} | 0 src/pages/404/template.js | 13 ---- src/pages/index/{template.js => Component.js} | 14 ++--- src/pages/index/{index.js => browser.js} | 4 +- src/prerender.js | 20 +++++++ src/template.html | 15 +++++ webpack.common.js | 4 +- webpack.prod.js | 59 +++++++++++++++---- yarn.lock | 8 +++ 13 files changed, 111 insertions(+), 44 deletions(-) rename src/pages/404/{index.js => browser.js} (100%) delete mode 100644 src/pages/404/template.js rename src/pages/index/{template.js => Component.js} (87%) rename src/pages/index/{index.js => browser.js} (91%) create mode 100644 src/prerender.js create mode 100644 src/template.html diff --git a/.babelrc b/.babelrc index 59bce79..0c97598 100644 --- a/.babelrc +++ b/.babelrc @@ -1,4 +1,4 @@ { "presets": ["env", "react"], - "plugins": ["transform-class-properties"] + "plugins": ["transform-class-properties", "syntax-dynamic-import"] } diff --git a/.gitignore b/.gitignore index 131321b..a076b55 100644 --- a/.gitignore +++ b/.gitignore @@ -20,6 +20,7 @@ node_modules/ # Build output build/ +prerender/ # Coverage reports coverage/ diff --git a/package.json b/package.json index 4a9e96f..3f8914d 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,9 @@ "start": "webpack-dev-server --config webpack.dev.js", "start:prod": "run-s build start:http-server", "start:http-server": "http-server ./build", - "build": "webpack --config webpack.prod.js", + "build": "run-s build:webpack build:prerender", + "build:webpack": "webpack --config webpack.prod.js", + "build:prerender": "node ./prerender/prerender.js", "test": "run-s test:lint 'test:unit --coverage'", "test:unit": "jest", "test:lint": "eslint --ignore-path .gitignore .", @@ -49,10 +51,12 @@ "babel-eslint": "^8.2.1", "babel-jest": "^22.2.2", "babel-loader": "^7.1.2", + "babel-plugin-syntax-dynamic-import": "^6.18.0", "babel-plugin-transform-class-properties": "^6.24.1", "babel-preset-env": "^1.6.1", "babel-preset-react": "^6.24.1", "babel-register": "^6.26.0", + "cheerio": "^1.0.0-rc.2", "copy-webpack-plugin": "^4.4.1", "css-loader": "^0.28.9", "enzyme": "^3.3.0", @@ -82,6 +86,7 @@ "uglifyjs-webpack-plugin": "^1.1.8", "webpack": "^3.10.0", "webpack-merge": "^4.1.1", + "webpack-node-externals": "^1.6.0", "workbox-webpack-plugin": "^2.1.2", "yaml-loader": "^0.5.0" }, diff --git a/src/components/App.js b/src/components/App.js index 5efe890..4c4b404 100644 --- a/src/components/App.js +++ b/src/components/App.js @@ -1,15 +1,11 @@ import React from 'react'; -import Header from './Header'; -import Footer from './Footer'; import Message from './Message'; -const App = () => -
+const App = () => (

Placeholder app content

-