-
Notifications
You must be signed in to change notification settings - Fork 0
/
static.config.js
executable file
·122 lines (109 loc) · 3.1 KB
/
static.config.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
import React from "react";
import fs from "fs";
import path from "path";
import webpack from "webpack";
import { ReportChunks } from "react-universal-component";
import flushChunks from "webpack-flush-chunks";
import APPCONFIG from "./src/config.json";
const resolve = p => path.resolve(__dirname, p);
const nodeModules = resolve("./node_modules");
// for SSR of dynamic imports
const externals = fs
.readdirSync(nodeModules)
.filter(
moduleName =>
!/\.bin|require-universal-module|react-universal-component|webpack-flush-chunks/.test(
moduleName
)
)
.reduce((externals, moduleName) => {
externals[moduleName] = moduleName;
return externals;
}, {});
export default {
getSiteProps: () => ({
title: "Markdown docs starter"
}),
siteRoot: "/",
getRoutes: async () => {
const routes = Object.entries(APPCONFIG.menu).map(r => {
const path = `/${r[0].replace(new RegExp(" ", "g"), "-").toLowerCase()}`;
const file = r[1];
const getProps = () => ({
file
});
return { path, getProps };
});
return [...routes];
},
renderToHtml: (renderToString, App, meta, prodStats) => {
const chunkNames = [];
const appHtml = renderToString(
<ReportChunks report={chunkName => chunkNames.push(chunkName)}>
<App />
</ReportChunks>
);
const { scripts } = flushChunks(prodStats, {
chunkNames
});
meta.scripts = scripts.filter(script => script.split(".")[0] !== "app");
return appHtml;
},
Document: ({ Html, Head, Body, children, renderMeta }) => (
<Html lang="en-US">
<Head>
<meta charSet="UTF-8" />
<title>Markdown docs starter</title>
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"
/>
</Head>
<Body>
{children}
{renderMeta.scripts &&
renderMeta.scripts.map(script => (
<script type="text/javascript" src={`/${script}`} />
))}
</Body>
</Html>
),
webpack: (config, { defaultLoaders, stage }) => {
// We replace the existing JS rule with one, that also transforms from
// remark-collapse
config.module.rules = [
{
oneOf: [
{
test: /\.md$/,
// remark-collapse has ES6 so we need to babel it
use: ["json-loader", "front-matter-loader"]
},
defaultLoaders.jsLoader,
defaultLoaders.cssLoader,
defaultLoaders.fileLoader
]
}
];
if (stage === "node") {
config.externals = externals;
config.plugins.push(
new webpack.optimize.LimitChunkCountPlugin({
maxChunks: 1
})
);
}
if (stage === "prod") {
config.output.filename = "app.[chunkHash:6].js";
config.output.chunkFilename = "[name].[chunkHash:6].js";
config.plugins.push(
new webpack.optimize.CommonsChunkPlugin({
name: "bootstrap",
filename: "bootstrap.[chunkHash:6].js",
minChunks: Infinity
})
);
}
return config;
}
};