Merge pull request #79 from relay-tools/update-example

[WIP] Update example app with latest changes.

Author: sibelius

README.md

@@ -2,8 +2,8 @@
 
 [![Build Status](https://travis-ci.org/relay-tools/relay-compiler-language-typescript.svg?branch=master)](https://travis-ci.org/relay-tools/relay-compiler-language-typescript)
 
-A language plugin for [Relay](https://facebook.github.io/relay/) that adds TypeScript support, including emitting type
-definitions.
+A language plugin for [Relay](https://facebook.github.io/relay/) that adds
+TypeScript support, including emitting type definitions.
 
 ## Installation
 
@@ -23,24 +23,26 @@ Then configure your `relay-compiler` script to use it, like so:
 ```json
 {
   "scripts": {
-    "relay": "relay-compiler --src ./src --schema data/schema.graphql --language typescript --artifactDirectory ./src/__generated__"
+    "relay":
+      "relay-compiler --src ./src --schema data/schema.graphql --language typescript --artifactDirectory ./src/__generated__"
   }
 }
 ```
 
-This is going to store all artifacts in a single directory, which you also need to instruct `babel-plugin-relay` to use in your `.babelrc`:
+This is going to store all artifacts in a single directory, which you also need
+to instruct `babel-plugin-relay` to use in your `.babelrc`:
 
 ```json
 {
-  "plugins": [
-    ["relay", { "artifactDirectory": "./src/__generated__" }]
-  ]
+  "plugins": [["relay", { "artifactDirectory": "./src/__generated__" }]]
 }
 ```
 
 ### TypeScript
 
-Also be sure to configure the TypeScript compiler to transpile to `es2015` modules and leave transpilation to `commonjs` modules up to Babel with the following `tsconfig.json` settings:
+Also be sure to configure the TypeScript compiler to transpile to `es2015`
+modules and leave transpilation to `commonjs` modules up to Babel with the
+following `tsconfig.json` settings:
 
 ```json
 {
@@ -51,34 +53,54 @@ Also be sure to configure the TypeScript compiler to transpile to `es2015` modul
 }
 ```
 
-The reason for this is that `tsc` would otherwise generate code where the imported `graphql` function is being namespaced (`react_relay_1` in this example):
+The reason for this is that `tsc` would otherwise generate code where the
+imported `graphql` function is being namespaced (`react_relay_1` in this
+example):
 
 ```js
-react_relay_1.createFragmentContainer(MyComponent, react_relay_1.graphql `
+react_relay_1.createFragmentContainer(
+  MyComponent,
+  react_relay_1.graphql`
   ...
-`);
+`
+);
 ```
 
-…and this makes it impossible for `babel-plugin-relay` to find the locations where the `graphql` function is being used.
+…and this makes it impossible for `babel-plugin-relay` to find the locations
+where the `graphql` function is being used.
 
-Note that this does mean you need to configure Babel to transform the ES module `import` and `export` statements, by using the [`babel-plugin-transform-es2015-modules-commonjs`](https://babeljs.io/docs/plugins/transform-es2015-modules-commonjs/) transform plugin, if you’re not already.
+Note that this does mean you need to configure Babel to transform the ES module
+`import` and `export` statements, by using the
+[`babel-plugin-transform-es2015-modules-commonjs`](https://babeljs.io/docs/plugins/transform-es2015-modules-commonjs/)
+transform plugin, if you’re not already.
 
 ## Problems
 
 ### React Hot Loader
 
-React Hot Loader is known to not always work well with generated code such as our typing artefacts, which will lead to loading modules _with_ TypeScript types into the browser and break. As a maintainer of RHL [pointed out](https://github.com/gaearon/react-hot-loader/issues/1032) in a similar issue:
+React Hot Loader is known to not always work well with generated code such as
+our typing artefacts, which will lead to loading modules _with_ TypeScript types
+into the browser and break. As a maintainer of RHL
+[pointed out](https://github.com/gaearon/react-hot-loader/issues/1032) in a
+similar issue:
 
- > The problem - hot reloading is not "complete"
+> The problem - hot reloading is not "complete"
 
-So [until RHL will be made “complete”](https://github.com/gaearon/react-hot-loader/issues/1024) this project can’t gurantee to always work well with it, nor is it our control to do anything about that.
+So
+[until RHL will be made “complete”](https://github.com/gaearon/react-hot-loader/issues/1024)
+this project can’t gurantee to always work well with it, nor is it our control
+to do anything about that.
 
-## Examples
+## Also see
 
-You can find a copy of the Relay
-[example TODO app](https://github.com/kastermester/relay-compiler-language-typescript/tree/master/example) inside this
-repository or you can take a look at the [Artsy React Native app](https://github.com/artsy/emission).
+* You can find a copy of the Relay
+  [example TODO app](https://github.com/kastermester/relay-compiler-language-typescript/tree/master/example)
+  inside this repository or you can take a look at the
+  [Artsy React Native app](https://github.com/artsy/emission).
+* There are Relay tslint rules available
+  [here](https://github.com/relay-tools/tslint-plugin-relay).
 
 ## License
 
-This package is available under the MIT license. See the included LICENSE file for details.
+This package is available under the MIT license. See the included LICENSE file
+for details.

example/.eslintignore

@@ -2,41 +2,38 @@
   "private": true,
   "scripts": {
     "start": "babel-node ./server.js",
-    "build": "relay-compiler --src ./ts/ --schema ./data/schema.graphql --language typescript --artifactDirectory ./ts/__relay_artifacts__",
+    "build":
+      "relay-compiler --src ./ts/ --schema ./data/schema.graphql --language typescript --artifactDirectory ./ts/__relay_artifacts__",
     "update-schema": "babel-node ./scripts/updateSchema.js",
-    "lint": "eslint ./js",
+    "lint": "tslint --project tsconfig.json",
     "type-check": "tsc --noEmit --pretty"
   },
   "resolutions": {
-    "graphql": "^0.13.1",
-    "relay-compiler-language-typescript": "file:../relay-compiler-language-typescript-1.1.0-alpha.1.tgz",
-    "relay-compiler": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/relay-compiler-1.6.1-plugin.1.tgz",
-    "graphql-compiler": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/graphql-compiler-1.6.1-plugin.1.tgz",
-    "relay-runtime": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/relay-runtime-1.6.1-plugin.1.tgz",
-    "babel-plugin-relay": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/babel-plugin-relay-1.6.1-plugin.1.tgz",
-    "react-relay": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/react-relay-1.6.1-plugin.1.tgz"
+    "relay-compiler-language-typescript":
+      "file:../relay-compiler-language-typescript-v1.1.1-alpha.2.tgz"
   },
   "dependencies": {
+    "@babel/core": "^7.0.0-0",
     "babel-core": "^6.26.0",
     "babel-loader": "^7.1.2",
-    "babel-plugin-relay": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/babel-plugin-relay-1.6.1-plugin.1.tgz",
+    "babel-plugin-relay": "^2.0.0-rc.1",
     "babel-plugin-transform-runtime": "^6.12.0",
     "babel-preset-es2015": "^6.13.2",
     "babel-preset-react": "^6.11.1",
     "babel-preset-stage-0": "^6.5.0",
     "babel-runtime": "^6.26.0",
     "classnames": "2.2.5",
     "express": "^4.15.2",
-    "express-graphql": "^0.6.4",
-    "graphql": "^0.13.1",
-    "graphql-compiler": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/graphql-compiler-1.6.1-plugin.1.tgz",
-    "graphql-relay": "^0.5.1",
+    "express-graphql": "^0.7.1",
+    "graphql": "^14.0.2",
+    "graphql-compiler": "^2.0.0-rc.1",
+    "graphql-relay": "^0.5.5",
     "prop-types": "^15.6.2",
     "react": "^16.4.1",
     "react-dom": "^16.4.1",
-    "react-relay": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/react-relay-1.6.1-plugin.1.tgz",
+    "react-relay": "^2.0.0-rc.1",
     "relay-devtools": "^1.4.0",
-    "relay-runtime": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/relay-runtime-1.6.1-plugin.1.tgz",
+    "relay-runtime": "^2.0.0-rc.1",
     "todomvc-app-css": "^2.1.0",
     "todomvc-common": "^1.0.3",
     "webpack": "^3.5.5",
@@ -52,15 +49,13 @@
     "babel-cli": "^6.26.0",
     "babel-eslint": "6.1.2",
     "csstype": "^2.5.6",
-    "eslint": "3.19.0",
-    "eslint-config-fbjs": "1.1.1",
-    "eslint-plugin-babel": "3.3.0",
-    "eslint-plugin-flowtype": "2.15.0",
-    "eslint-plugin-react": "5.2.2",
     "fork-ts-checker-webpack-plugin": "^0.3.0",
-    "relay-compiler": "https://github.com/alloy/relay/releases/download/v1.6.1-plugin.1/relay-compiler-1.6.1-plugin.1.tgz",
-    "relay-compiler-language-typescript": "file:../relay-compiler-language-typescript-1.1.0-alpha.1.tgz",
+    "relay-compiler": "^2.0.0-rc.1",
+    "relay-compiler-language-typescript":
+      "file:../relay-compiler-language-typescript-v1.1.1-alpha.2.tgz",
     "ts-loader": "^3.2.0",
+    "tslint": "^5.12.0",
+    "tslint-plugin-relay": "^0.0.3",
     "typescript": "2.9.1"
   }
 }

example/.eslintrc

@@ -7,7 +7,5 @@
     "strict": true,
     "target": "es2015"
   },
-  "exclude": [
-    "node_modules"
-  ]
+  "exclude": ["node_modules"]
 }

example/package.json

@@ -0,0 +1,20 @@
+{
+  "defaultSeverity": "error",
+  "extends": ["tslint:recommended", "tslint-plugin-relay"],
+  "jsRules": {},
+  "rules": {
+    "arrow-parens": false,
+    "interface-name": false,
+    "object-literal-sort-keys": false,
+    "variable-name": false,
+    "trailing-comma": false,
+    "quotemark": false,
+    "ordered-imports": false,
+    "no-console": false,
+    "semicolon": false,
+    "member-access": false,
+    "curly": false,
+    "object-literal-shorthand": false
+  },
+  "rulesDirectory": []
+}