ts-node issue snapshot

    [10:28:53] Requiring external module ts-node/register

    project/node_modules/ts-node/dist/ts-node.js:68
            var result = output.outputFiles[1].text;
                                              ^
    TypeError: Cannot read property 'text' of undefined
        at getOutput (project/node_modules/ts-node/dist/ts-node.js:68:43)
        at compile (project/node_modules/ts-node/dist/ts-node.js:91:16)
        at Object.loader (project/node_modules/ts-node/dist/ts-node.js:94:27)
        at Module.load (module.js:355:32)
        at Function.Module._load (module.js:310:12)
        at Module.require (module.js:365:17)
        at require (module.js:384:17)
        at Liftoff.handleArguments (project/node_modules/gulp/bin/gulp.js:116:3)
        at Liftoff.<anonymous> (project/node_modules/gulp/node_modules/liftoff/index.js:192:16)
        at module.exports (project/node_modules/gulp/node_modules/liftoff/node_modules/flagged-respawn/index.js:17:3)

gulpfile.ts

@@ -4,7 +4,6 @@ import * as path from 'path';
 
 const gulp = require('gulp');
 const del = require('del');
-const deepmerge = require('deepmerge');
 const {log, colors} = require('gulp-util');
 
 const $ = {

package.json

@@ -13,6 +13,7 @@
     "eslint-plugin-react": "^2.3.0",
     "gulp": "^3.9.0",
     "gulp-changed": "^1.3.0",
+    "gulp-changed-in-place": "^2.0.1",
     "gulp-cli": "^0.3.0",
     "gulp-collector": "^0.1.0",
     "gulp-dev-express": "^1.0.1",
@@ -38,6 +39,8 @@
   },
   "dependencies": {
     "express": "^4.13.3",
+    "lodash": "^3.10.1",
+    "radium": "^0.14.2",
     "react": "^0.13.0"
   }
 }

src/client/app.tsx

@@ -1,13 +1,48 @@
+const Radium = require('radium');
+
 import * as React from 'react';
 
+enum Kinds {
+  primary,
+  warning
+}
+
 interface HelloWorldProps extends React.Props<any> {
   name: string;
+  kind: Kinds;
 }
 
+var styles = {
+  base: {
+    color: '#fff'
+  },
+
+  [Kinds.primary]: {
+    background: '#0074D9'
+  },
+
+  [Kinds.warning]: {
+    background: '#FF4136'
+  }
+};
+
+// @Radium
 export default class App extends React.Component<HelloWorldProps, any> {
+  static propTypes: React.ValidationMap<any> = {
+    kind: React.PropTypes.oneOf([Kinds.primary, Kinds.warning]).isRequired
+  };
+
   render() {
     return (
-      <h1>Hello, {this.props.name}...</h1>
+      <div style={[
+        styles.base,
+        styles[this.props.kind]
+      ]}>
+        <h1>Hello, {this.props.name}...</h1>
+        <div src="[[ ./images/twitter.svg ]]" />
+        </div>
     );
   }
 }
+
+module.exports = App;

src/client/index.tsx

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import App from './App';
+import App1 = require('./App');
 
-React.render(<App name="World" />, document.getElementById('root'));
+React.render(<App name="World" kind={App.Kinds.primary} />, document.getElementById('root'));
 
 document.getElementById('time').innerHTML = new Date().toString();

src/public/index.html

@@ -7,6 +7,6 @@ <h1>Testing...</h1>
     <div id="time"></div>
 
     --- <div id="root"></div> ---
-    <script src="/static/bundle.js"></script>
+    <script src="/static/app.js"></script>
   </body>
 </html>

src/server/webpack.ts

@@ -11,6 +11,7 @@ const app = new WebpackDevServer(webpack(config), {
   historyApiFallback: true,
   publicPath: '/static/',
   stats: { colors: true },
+  proxy: { '*': 'http://localhost:3000' },
 });
 
 app.listen(3001, 'localhost', function() {

tsconfig.json

@@ -1,6 +1,8 @@
 {
   "compilerOptions": {
     "declaration": false,
+    "target": "es5",
+    "experimentalDecorators": true,
     "noLib": false,
     "module": "commonjs",
     "jsx": "react",

webpack.common.js

@@ -5,7 +5,7 @@ module.exports = {
     react: {
       test: /\.ts(x)?$/,
       loaders: ['react-hot', 'ts-loader'],
-      include: path.join(__dirname, 'src', 'client')
+      include: path.join(__dirname, 'src', 'client'),
     },
   },
   preLoaders: {

webpack.config-development.js

@@ -24,10 +24,6 @@ module.exports = {
     ],
     loaders: [
       common.loaders.react,
-      {
-        test: /[.]html$/,
-        loader: 'file'
-      }
     ]
   }
 };