Skip to content

Commit 2a6979b

Browse files
tomconroytomconroy
authored
Merge pull request #33 from firstlookmedia/relay-modern
Relay modern
2 parents 20b3fcd + 59c9851 commit 2a6979b

File tree

8 files changed

+144
-72
lines changed

8 files changed

+144
-72
lines changed

‎package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -62,10 +62,11 @@
6262
"react-dom": ">=15.3.0",
6363
"react-relay": ">= 0.9.0",
6464
"react-test-renderer": ">=15.3.0",
65+
"relay-compiler": ">=1.4.1",
6566
"source-map-support": ">=0.4.2"
6667
},
6768
"devDependencies": {
68-
"babel-relay-plugin": "0.10.0",
69+
"babel-plugin-relay": "^1.4.1",
6970
"core-js": "^2.4.1",
7071
"enzyme": "^2.7.1",
7172
"eslint": "^3.2.2",

‎scripts/build.js

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,10 @@ const fs = require('fs');
77
const path = require('path');
88
const gzipSize = require('gzip-size').sync;
99
const chalk = require('chalk');
10+
const spawn = require('cross-spawn');
1011
const clientConfig = require('../config/webpack.client.prod');
1112
const serverConfig = require('../config/webpack.server');
13+
const relayCompilerArguments = require('./utils/relayCompilerArguments');
1214

1315
function printFileSizes(stats, config) {
1416
const outputPath = config.output.path;
@@ -56,12 +58,25 @@ function handler(config, err, stats) {
5658
printFileSizes(stats, config);
5759
}
5860
}
61+
console.log('Compiling relay queries...');
62+
const relayCompiler = spawn(
63+
path.resolve('./node_modules/.bin/relay-compiler'),
64+
relayCompilerArguments,
65+
{ stdio: 'inherit' }
66+
);
5967

60-
console.log('Building optimized assets...');
61-
webpack(clientConfig).run((err, stats) => {
62-
handler(clientConfig, err, stats);
68+
relayCompiler.on('close', (code) => {
69+
if (code) {
70+
process.exit(code);
71+
return;
72+
}
73+
74+
console.log('Building optimized assets...');
75+
webpack(clientConfig).run((err, stats) => {
76+
handler(clientConfig, err, stats);
6377

64-
console.log();
65-
console.log('Building server files...');
66-
webpack(serverConfig).run(handler.bind(null, serverConfig));
78+
console.log();
79+
console.log('Building server files...');
80+
webpack(serverConfig).run(handler.bind(null, serverConfig));
81+
});
6782
});

‎scripts/start.js

Lines changed: 40 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,10 @@ const webpackDevMiddleware = require('webpack-dev-middleware');
77
const webpackHotMiddleware = require('webpack-hot-middleware');
88
const express = require('express');
99
const httpProxy = require('http-proxy');
10+
const chalk = require('chalk');
1011
const config = require('../config/webpack.client.dev');
1112
const serverConfig = require('../config/webpack.server.dev');
13+
const relayCompilerArguments = require('./utils/relayCompilerArguments');
1214

1315
const app = express();
1416

@@ -40,18 +42,34 @@ app.all('*', (req, res) => {
4042
<html>
4143
<head>
4244
<style>
43-
body { background: black; color: white; font-family: Menlo, monospace; }
45+
html, body { height: 100%; }
46+
body {
47+
background: #e9fff8;
48+
color: #2b005a;
49+
font-family: system, -apple-system,
50+
".SFNSText-Regular", HelveticaNeue, LucidaGrande;
51+
font-size: 42px;
52+
font-weight: bold;
53+
display: flex;
54+
justify-content: center;
55+
align-items: center;
56+
margin: 0;
57+
padding: 0;
58+
}
4459
</style>
4560
<script>
46-
var i = 0;
47-
setInterval(function(){
48-
document.body.innerHTML = 'Building server' + Array(i).fill('.').join('');
49-
i = (i + 1) % 4;
50-
}, 200)
51-
setTimeout("location.reload()", 300);
61+
let i = 0;
62+
function gradiate() {
63+
document.body.style.backgroundColor = 'hsl('+ ((i * 2) % 360) + ',100%,96%)';
64+
i++;
65+
requestAnimationFrame(gradiate);
66+
}
67+
requestAnimationFrame(gradiate);
68+
69+
setTimeout("location.reload()", 3000);
5270
</script>
5371
</head>
54-
<body></body>
72+
<body>Building server...</body>
5573
</html>`);
5674
});
5775
} else {
@@ -65,7 +83,10 @@ app.listen(PORT, (err) => {
6583
if (err) {
6684
return console.error(err);
6785
}
68-
return console.log(`Dev server is listening on port ${PORT} and proxying to app server`);
86+
const url = `http://localhost:${PORT}`;
87+
return console.log(`
88+
Development server started. Visit ${chalk.bold.green(url)}
89+
`);
6990
});
7091

7192
const serverCompiler = webpack(Object.assign({}, serverConfig));
@@ -75,7 +96,7 @@ let child;
7596

7697
function startServer() {
7798
child = spawn('node', [serverPath], { stdio: 'inherit' });
78-
child.on('exit', () => {
99+
child.on('close', () => {
79100
child = null;
80101
});
81102
}
@@ -89,7 +110,6 @@ function restartServer() {
89110
}
90111
}
91112

92-
console.log('Compiling server build... this will take a while...');
93113
serverCompiler.watch({ poll: 1000 }, (err, stats) => {
94114
if (err) {
95115
console.error(err.message || err);
@@ -101,3 +121,12 @@ serverCompiler.watch({ poll: 1000 }, (err, stats) => {
101121
restartServer();
102122
}
103123
});
124+
125+
const relayCompiler = spawn(
126+
path.resolve('./node_modules/.bin/relay-compiler'),
127+
relayCompilerArguments.concat('--watch'),
128+
{ stdio: 'inherit' }
129+
);
130+
131+
relayCompiler.on('close', code => process.exit(code));
132+
process.on('close', code => relayCompiler.exit(code));

‎scripts/utils/__mocks__/react-relay.js

Lines changed: 3 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,5 @@
1-
const Relay = jest.genMockFromModule('react-relay');
1+
const Relay = jest.genMockFromModule('react-relay/classic');
22

3-
class MockStore {
4-
reset() {
5-
this.successResponse = undefined;
6-
}
3+
Relay.createFragmentContainer = (component) => component;
74

8-
succeedWith(response) {
9-
this.reset();
10-
this.successResponse = response;
11-
}
12-
13-
failWith(response) {
14-
this.reset();
15-
this.failureResponse = response;
16-
}
17-
18-
update(callbacks) {
19-
if (this.successResponse) {
20-
callbacks.onSuccess(this.successResponse);
21-
} else if (this.failureResponse) {
22-
callbacks.onFailure(this.failureResponse);
23-
}
24-
this.reset();
25-
}
26-
27-
commitUpdate(mutation, callbacks) {
28-
return this.update(callbacks);
29-
}
30-
31-
applyUpdate(mutation, callbacks) {
32-
return this.update(callbacks);
33-
}
34-
}
35-
36-
module.exports = {
37-
QL: Relay.QL,
38-
Mutation: Relay.Mutation,
39-
Route: Relay.Route,
40-
RootContainer: () => null,
41-
createContainer: (component) => component,
42-
Store: new MockStore(),
43-
};
5+
module.exports = Relay;

‎scripts/utils/__mocks__/react-relay/compat.js

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
const Relay = jest.genMockFromModule('react-relay/classic');
2+
3+
Relay.createFragmentContainer = (component) => component;
4+
5+
module.exports = Relay;

‎scripts/utils/createJestConfig.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ module.exports = () => ({
44
moduleNameMapper: {
55
'\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$': path.resolve(__dirname, '__mocks__/file.js'),
66
'\\.(css)$': require.resolve('identity-obj-proxy'),
7+
'react-relay/compat': path.resolve(__dirname, '__mocks__/react-relay/compat.js'),
78
'react-relay/classic': path.resolve(__dirname, '__mocks__/react-relay/classic.js'),
89
'react-relay': path.resolve(__dirname, '__mocks__/react-relay.js'),
910
},

‎scripts/utils/relayCompilerArguments.js

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
const path = require('path');
2+
3+
const packageConfig = require(path.resolve('package.json'));
4+
5+
// relay compiler
6+
7+
let includePaths = ['src/**'];
8+
let excludePaths = ['**/__generated__/**'];
9+
if ('react-scripts' in packageConfig) {
10+
const moduleName = packageConfig['react-scripts'].sharedComponentModule;
11+
if (moduleName) {
12+
includePaths = includePaths.concat(`node_modules/${moduleName}/lib/**`);
13+
excludePaths = excludePaths.concat(`node_modules/${moduleName}/node_modules/**`);
14+
}
15+
}
16+
17+
module.exports = [
18+
'--src',
19+
path.resolve('.'),
20+
21+
'--include',
22+
includePaths,
23+
24+
'--exclude',
25+
excludePaths,
26+
27+
'--schema',
28+
'schema.json',
29+
].reduce((acc, item) => acc.concat(item), []);

‎yarn.lock

Lines changed: 43 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -493,6 +493,14 @@ babel-plugin-jest-hoist@^19.0.0:
493493
version "19.0.0"
494494
resolved "https://registry.yarnpkg.com/babel-plugin-jest-hoist/-/babel-plugin-jest-hoist-19.0.0.tgz#4ae2a04ea612a6e73651f3fde52c178991304bea"
495495

496+
babel-plugin-relay@^1.4.1:
497+
version "1.4.1"
498+
resolved "https://registry.yarnpkg.com/babel-plugin-relay/-/babel-plugin-relay-1.4.1.tgz#8ac562bcb1fd2b3565d271aaced32be42c827353"
499+
dependencies:
500+
babel-runtime "^6.23.0"
501+
babel-types "^6.24.1"
502+
graphql "^0.11.3"
503+
496504
babel-plugin-syntax-async-functions@^6.8.0:
497505
version "6.13.0"
498506
resolved "https://registry.yarnpkg.com/babel-plugin-syntax-async-functions/-/babel-plugin-syntax-async-functions-6.13.0.tgz#cad9cad1191b5ad634bf30ae0872391e0647be95"
@@ -955,12 +963,6 @@ babel-register@^6.18.0:
955963
mkdirp "^0.5.1"
956964
source-map-support "^0.4.2"
957965

958-
[email protected]:
959-
version "0.10.0"
960-
resolved "https://registry.yarnpkg.com/babel-relay-plugin/-/babel-relay-plugin-0.10.0.tgz#c7adede2b27dcc4aeedcb1ae760e364b2bacfaa0"
961-
dependencies:
962-
graphql "0.8.2"
963-
964966
babel-runtime@^6.0.0, babel-runtime@^6.23.0:
965967
version "6.25.0"
966968
resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.25.0.tgz#33b98eaa5d482bb01a8d1aa6b437ad2b01aec41c"
@@ -975,6 +977,13 @@ babel-runtime@^6.11.6, babel-runtime@^6.9.0, babel-runtime@^6.9.1:
975977
core-js "^2.4.0"
976978
regenerator-runtime "^0.9.5"
977979

980+
babel-runtime@^6.26.0:
981+
version "6.26.0"
982+
resolved "https://registry.yarnpkg.com/babel-runtime/-/babel-runtime-6.26.0.tgz#965c7058668e82b55d7bfe04ff2337bc8b5647fe"
983+
dependencies:
984+
core-js "^2.4.0"
985+
regenerator-runtime "^0.11.0"
986+
978987
babel-template@^6.14.0, babel-template@^6.15.0, babel-template@^6.16.0, babel-template@^6.8.0:
979988
version "6.16.0"
980989
resolved "https://registry.yarnpkg.com/babel-template/-/babel-template-6.16.0.tgz#e149dd1a9f03a35f817ddbc4d0481988e7ebc8ca"
@@ -1008,6 +1017,15 @@ babel-types@^6.13.0, babel-types@^6.16.0, babel-types@^6.18.0, babel-types@^6.8.
10081017
lodash "^4.2.0"
10091018
to-fast-properties "^1.0.1"
10101019

1020+
babel-types@^6.24.1:
1021+
version "6.26.0"
1022+
resolved "https://registry.yarnpkg.com/babel-types/-/babel-types-6.26.0.tgz#a3b073f94ab49eb6fa55cd65227a334380632497"
1023+
dependencies:
1024+
babel-runtime "^6.26.0"
1025+
esutils "^2.0.2"
1026+
lodash "^4.17.4"
1027+
to-fast-properties "^1.0.3"
1028+
10111029
babel@^6.5.2:
10121030
version "6.5.2"
10131031
resolved "https://registry.yarnpkg.com/babel/-/babel-6.5.2.tgz#59140607438270920047ff56f02b2d8630c2d129"
@@ -2821,11 +2839,11 @@ graceful-fs@^4.0.0, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.1.9:
28212839
version "1.0.1"
28222840
resolved "https://registry.yarnpkg.com/graceful-readlink/-/graceful-readlink-1.0.1.tgz#4cafad76bc62f02fa039b2f94e9a3dd3a391a725"
28232841

2824-
graphql@0.8.2:
2825-
version "0.8.2"
2826-
resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.8.2.tgz#eb1bb524b38104bbf2c9157f9abc67db2feba7d2"
2842+
graphql@^0.11.3:
2843+
version "0.11.7"
2844+
resolved "https://registry.yarnpkg.com/graphql/-/graphql-0.11.7.tgz#e5abaa9cb7b7cccb84e9f0836bf4370d268750c6"
28272845
dependencies:
2828-
iterall "1.0.2"
2846+
iterall "1.1.3"
28292847

28302848
growly@^1.3.0:
28312849
version "1.3.0"
@@ -3551,9 +3569,9 @@ istanbul-reports@^1.0.2:
35513569
dependencies:
35523570
handlebars "^4.0.3"
35533571

3554-
iterall@1.0.2:
3555-
version "1.0.2"
3556-
resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.0.2.tgz#41a2e96ce9eda5e61c767ee5dc312373bb046e91"
3572+
iterall@1.1.3:
3573+
version "1.1.3"
3574+
resolved "https://registry.yarnpkg.com/iterall/-/iterall-1.1.3.tgz#1cbbff96204056dde6656e2ed2e2226d0e6d72c9"
35573575

35583576
jest-changed-files@^19.0.2:
35593577
version "19.0.2"
@@ -4195,6 +4213,10 @@ lodash@^4.0.0, lodash@^4.14.0, lodash@^4.17.2, lodash@^4.3.0:
41954213
version "4.17.4"
41964214
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.4.tgz#78203a4d1c328ae1d86dca6460e369b57f4055ae"
41974215

4216+
lodash@^4.17.4:
4217+
version "4.17.5"
4218+
resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.5.tgz#99a92d65c0272debe8c96b6057bc8fbfa3bed511"
4219+
41984220
logalot@^2.0.0:
41994221
version "2.1.0"
42004222
resolved "https://registry.yarnpkg.com/logalot/-/logalot-2.1.0.tgz#5f8e8c90d304edf12530951a5554abb8c5e3f552"
@@ -5472,6 +5494,10 @@ regenerator-runtime@^0.10.0:
54725494
version "0.10.5"
54735495
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.10.5.tgz#336c3efc1220adcedda2c9fab67b5a7955a33658"
54745496

5497+
regenerator-runtime@^0.11.0:
5498+
version "0.11.1"
5499+
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz#be05ad7f9bf7d22e056f9726cee5017fbf19e2e9"
5500+
54755501
regenerator-runtime@^0.9.5:
54765502
version "0.9.6"
54775503
resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.9.6.tgz#d33eb95d0d2001a4be39659707c51b0cb71ce029"
@@ -6152,6 +6178,10 @@ to-fast-properties@^1.0.1:
61526178
version "1.0.2"
61536179
resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.2.tgz#f3f5c0c3ba7299a7ef99427e44633257ade43320"
61546180

6181+
to-fast-properties@^1.0.3:
6182+
version "1.0.3"
6183+
resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-1.0.3.tgz#b83571fa4d8c25b82e231b06e3a3055de4ca1a47"
6184+
61556185
tough-cookie@^2.2.0, tough-cookie@^2.3.1, tough-cookie@^2.3.2, tough-cookie@~2.3.0:
61566186
version "2.3.2"
61576187
resolved "https://registry.yarnpkg.com/tough-cookie/-/tough-cookie-2.3.2.tgz#f081f76e4c85720e6c37a5faced737150d84072a"

0 commit comments

Comments
 (0)