';
21 | let insertPoint = html.indexOf(mountPoint) + mountPoint.length;
22 | return insertString(html, insertPoint, content);
23 | }
24 |
25 | const app = new Koa();
26 |
27 | app.use(async (ctx, next) => {
28 | try {
29 | await next();
30 | } catch (err) {
31 | ctx.body = `
${err.message}
${err.stack}`;
32 | ctx.status = err.status || 500;
33 | }
34 | });
35 |
36 | app.use(compress({
37 | threshold: 2048,
38 | flush: require('zlib').Z_SYNC_FLUSH
39 | }))
40 |
41 | app.use(async (ctx, next) => {
42 | let matched = true;
43 | match({routes, location: ctx.url}, (error, redirectLocation, renderProps) => {
44 | if (error) {
45 | ctx.status = 500;
46 | ctx.message = error.message;
47 | } else if (redirectLocation) {
48 | ctx.redirect(302, redirectLocation.pathname + redirectLocation.search)
49 | } else if (renderProps) {
50 | ctx.status = 200;
51 | ctx.body = generatePage(ReactDOMServer.renderToString(
));
52 | } else {
53 | matched = false;
54 | }
55 | });
56 | if(!matched) {
57 | await next();
58 | }
59 | });
60 |
61 | app.use(serve('dist/client'));
62 |
63 | const optionDefinitions = [
64 | { name: 'port', alias: 'p', type: Number, defaultValue: 3000 },
65 | { name: 'https', alias: 's', type: Boolean, defaultValue: false },
66 | ];
67 | const options = commandLineArgs(optionDefinitions);
68 |
69 | if (!options.https) {
70 | app.listen(options.port);
71 | console.log(`Listening on http://localhost:${options.port}`);
72 | } else {
73 | pem.createCertificate({
74 | days: 1,
75 | selfSigned: true
76 | }, function(err, keys){
77 | const credentials = {
78 | key: keys.serviceKey,
79 | cert: keys.certificate
80 | };
81 |
82 | const server = spdy.createServer(credentials, app.callback());
83 | server.listen(options.port, function() {
84 | console.log(`Listening on https://localhost:${options.port}`);
85 | });
86 | });
87 | }
88 |
--------------------------------------------------------------------------------
/server/nginx.conf:
--------------------------------------------------------------------------------
1 | server {
2 | listen 80;
3 | server_name your_domain.com;
4 |
5 | location / {
6 | root /var/web/your_project/dist/client;
7 | try_files $uri /index.html;
8 | }
9 | }
10 |
--------------------------------------------------------------------------------
/webpack.config.js:
--------------------------------------------------------------------------------
1 | const path = require('path');
2 | const webpack = require('webpack');
3 | const merge = require('webpack-merge');
4 | const HtmlwebpackPlugin = require('html-webpack-plugin');
5 | const ExtractTextPlugin = require('extract-text-webpack-plugin');
6 | const gitRevision = require('git-revision');
7 | const packages = require('./package.json');
8 |
9 | const BUILD = process.env.BABEL_ENV = process.env.NODE_ENV;
10 |
11 | const PATHS = {
12 | app: path.join(__dirname, 'app'),
13 | dist: path.join(__dirname, 'dist/client'),
14 | };
15 |
16 | const common = {
17 | output: {
18 | path: PATHS.dist,
19 | publicPath: '/'
20 | },
21 | resolve: {
22 | extensions: ['.js', '.jsx']
23 | },
24 | module: {
25 | rules: [
26 | {
27 | test: /\.jsx?$/,
28 | use: ['babel-loader'],
29 | include: PATHS.app
30 | },
31 | {
32 | test: /\.(jpe?g|png|gif|svg)$/i,
33 | use: ['file-loader?name=img/[hash].[ext]', 'img-loader?-minimize']
34 | }
35 | ]
36 | },
37 | plugins: [
38 | new HtmlwebpackPlugin({
39 | template: 'app/index.html',
40 | inject: 'body'
41 | })
42 | ]
43 | };
44 |
45 | const different = function(build) {
46 | switch(build) {
47 | case "development":
48 | return {
49 | entry: PATHS.app,
50 | output: {
51 | filename: 'bundle.js'
52 | },
53 | module: {
54 | rules: [
55 | {
56 | test: /\.sass$/,
57 | use: ['style-loader', 'css-loader', 'sass-loader?indentedSyntax=true'],
58 | include: PATHS.app
59 | }
60 | ]
61 | },
62 | // devtool: 'eval-source-map',
63 | devServer: {
64 | historyApiFallback: true,
65 | hot: true,
66 | inline: true,
67 | stats: 'errors-only',
68 | host: process.env.HOST,
69 | port: parseInt(process.env.PORT)
70 | },
71 | plugins: [
72 | new webpack.HotModuleReplacementPlugin()
73 | ]
74 | };
75 | case "production":
76 | return {
77 | entry: {
78 | app: PATHS.app,
79 | vendor: Object.keys(packages.dependencies)
80 | },
81 | output: {
82 | filename: 'js/[name].[chunkhash].js',
83 | chunkFilename: '[chunkhash].js'
84 | },
85 | module: {
86 | rules: [
87 | {
88 | test: /\.sass$/,
89 | use: ExtractTextPlugin.extract({
90 | fallback: "style-loader",
91 | use: ['css-loader', 'sass-loader?indentedSyntax=true']
92 | }),
93 | include: PATHS.app
94 | }
95 | ]
96 | },
97 | plugins: [
98 | new webpack.DefinePlugin({
99 | "process.env": {
100 | VERSION: JSON.stringify(gitRevision("short")),
101 | NODE_ENV: JSON.stringify("production"),
102 | }
103 | }),
104 | new ExtractTextPlugin("css/[name].[chunkhash].css"),
105 | new webpack.optimize.CommonsChunkPlugin({
106 | names: ['vendor', 'manifest']
107 | }),
108 | new webpack.optimize.UglifyJsPlugin({
109 | compress: {warnings: false}
110 | })
111 | ]
112 | };
113 | default:
114 | return {};
115 | }
116 | }(BUILD);
117 |
118 | module.exports = merge(common, different);
119 |
--------------------------------------------------------------------------------
/webpack.server.js:
--------------------------------------------------------------------------------
1 | const fs = require('fs');
2 | const path = require('path');
3 | const webpack = require('webpack');
4 | const merge = require('webpack-merge');
5 | const ExtractTextPlugin = require('extract-text-webpack-plugin');
6 | const packages = require('./package.json');
7 |
8 | const BUILD = process.env.BABEL_ENV = process.env.NODE_ENV;
9 |
10 | const PATHS = {
11 | app: path.join(__dirname, 'app'),
12 | server: path.join(__dirname, 'server/entry.jsx'),
13 | dist: path.join(__dirname, 'dist/server'),
14 | };
15 |
16 | const common = {
17 | output: {
18 | path: PATHS.dist,
19 | publicPath: '/'
20 | },
21 | target: 'node',
22 | externals: fs.readdirSync('node_modules'),
23 | resolve: {
24 | extensions: ['.js', '.jsx']
25 | },
26 | module: {
27 | rules: [
28 | {
29 | test: /\.jsx?$/,
30 | use: ['babel-loader'],
31 | include: [PATHS.app, PATHS.server]
32 | },
33 | {
34 | test: /\.(jpe?g|png|gif|svg)$/i,
35 | use: ['file-loader?name=img/[hash].[ext]', 'img-loader?-minimize']
36 | }
37 | ]
38 | }
39 | };
40 |
41 | const different = function(build) {
42 | switch(build) {
43 | case "development":
44 | return {
45 | };
46 | case "production":
47 | return {
48 | entry: PATHS.server,
49 | output: {
50 | filename: 'entry.js',
51 | libraryTarget: 'commonjs2'
52 | },
53 | module: {
54 | rules: [
55 | {
56 | test: /\.sass$/,
57 | use: ExtractTextPlugin.extract({
58 | fallback: "style-loader",
59 | use: ['css-loader', 'sass-loader?indentedSyntax=true']
60 | }),
61 | include: PATHS.app
62 | }
63 | ]
64 | },
65 | plugins: [
66 | new webpack.DefinePlugin({
67 | "process.env": {
68 | NODE_ENV: JSON.stringify("production")
69 | }
70 | }),
71 | new ExtractTextPlugin("css/[chunkhash].css"),
72 | // new webpack.optimize.UglifyJsPlugin({
73 | // compress: {warnings: false}
74 | // })
75 | ]
76 | };
77 | default:
78 | return {};
79 | }
80 | }(BUILD);
81 |
82 | module.exports = merge(common, different);
83 |
--------------------------------------------------------------------------------