Copied over from ember-cli-typify

Author: Marius Seritan

.gitignore

@@ -15,3 +15,4 @@
 /libpeerconnection.log
 npm-debug.log*
 testem.log
+yarn.lock

README.md

@@ -1,27 +1,31 @@
 # ember-cli-typescript
 
-This README outlines the details of collaborating on this Ember addon.
+Enable typescript preprocessing on Ember 2.x apps.
 
-## Installation
 
-* `git clone <repository-url>` this repository
-* `cd ember-cli-typescript`
-* `npm install`
-* `bower install`
+## One time setup
 
-## Running
+To use install dependencies
 
-* `ember serve`
-* Visit your app at [http://localhost:4200](http://localhost:4200).
+    npm install --save-dev [email protected] # Older versions are not supported
+    npm install --save-dev ember-cli-typescript
+    npm install --save-dev @types/ember
 
-## Running Tests
+Create a tsconfig.json file:
 
-* `npm test` (Runs `ember try:each` to test your addon against multiple Ember versions)
-* `ember test`
-* `ember test --server`
+    ember generate ember-cli-typescript
 
-## Building
+## Incremental adoption
 
-* `ember build`
+Rename the files you want to check from `.js` to `.ts`.
 
-For more information on using ember-cli, visit [https://ember-cli.com/](https://ember-cli.com/).
+## VSCode setup
+
+Create the file `.vscode/settings.json` with the following content:
+
+```json
+// Place your settings in this file to overwrite default and user settings.
+{
+    "typescript.tsdk" : "node_modules/typescript/lib"
+}
+```

blueprints/ember-cli-typify/files/app/config/environment.d.ts

@@ -0,0 +1,12 @@
+export default config;
+
+/**
+ * Type declarations for
+ *    import config from './config/environment'
+ *
+ * For now these need to be managed by the developer
+ * since different ember addons can materialize new entries.
+ */
+declare namespace config {
+  export var environment: any;
+}

blueprints/ember-cli-typify/files/tsconfig.json

@@ -0,0 +1,17 @@
+{
+  "compilerOptions": {
+    "target": "ES6",
+    "allowJs": true,
+    "moduleResolution": "node",
+    "noEmitOnError": true,
+    "noEmit": true,
+    "baseUrl": ".",
+    "paths": {
+      "npm:*": ["local-types/*"],
+      "*": ["local-types/*"]
+    }
+  },
+  "include": [
+    "app/**/*"
+  ]
+}

blueprints/ember-cli-typify/index.js

@@ -0,0 +1,27 @@
+var path = require('path');
+
+module.exports = {
+  description: 'Initialize files needed for typescript compilation',
+
+  files: function() {
+    return [
+      path.join(this.path, 'files', 'tsconfig.json'),
+      path.join(this.path, 'files', 'app', 'config', 'environment.d.ts')
+      ];
+  },
+
+   mapFile: function() {
+    var result = this._super.mapFile.apply(this, arguments);
+    if (result.indexOf('/tsconfig.json')>-1) {
+      return 'tsconfig.json';
+    } else if (result.indexOf('/app/')>-1) {
+      var pos = result.indexOf('/app/');
+      return result.substring(pos+1);
+    }
+  },
+
+  normalizeEntityName: function() {
+    // Entity name is optional right now, creating this hook avoids an error.
+  }
+}
+

debug.sh

@@ -0,0 +1 @@
+node --inspect --debug-brk node_modules/.bin/ember build

index.js

@@ -1,6 +1,32 @@
 /* jshint node: true */
+
 'use strict';
+var path      = require('path');
+var process = require('process');
+var TsPreprocessor = require('./lib/typescript-preprocessor');
 
 module.exports = {
-  name: 'ember-cli-typescript'
+  name: 'ember-cli-typescript',
+
+
+  included: function(app) {
+    this._super.included.apply(this, arguments);
+    this.app = app;
+
+  },
+
+  blueprintsPath: function() {
+    return path.join(__dirname, 'blueprints');
+  },
+
+  setupPreprocessorRegistry: function(type, registry) {
+    try {
+      var plugin = new TsPreprocessor({includeExtensions: ['.ts','.js']});
+      registry.add('js', plugin);
+    } catch ( ex ) {
+      console.log( "Missing or invalid tsconfig.json, please fix or run `ember generate ember-cli-typescript`." );
+      console.log( '  ' + ex.toString());
+    }
+  }
+
 };

lib/typescript-preprocessor.js

@@ -0,0 +1,95 @@
+var tsc = require('broccoli-typescript-compiler').typescript;
+var fs = require('fs');
+var debug = require('debug')('ember-cli-typescript');
+var ts = require('typescript');
+var stew = require('broccoli-stew');
+var find = stew.find;
+var MergeTrees = require("broccoli-merge-trees");
+var Funnel = require("broccoli-funnel");
+
+function TypeScriptPreprocessor(options) {
+  debug('creating new instance with options ', options);
+  this.name = 'ember-cli-typescript';
+  this.ext = 'ts';
+  this.options = JSON.parse(JSON.stringify(options));
+}
+
+function readConfig(configFile) {
+    var result = ts.readConfigFile(configFile, ts.sys.readFile);
+    if (result.error) {
+        var message = ts.flattenDiagnosticMessageText(result.error.messageText, "\n");
+        throw new Error(message);
+    }
+    return result.config;
+}
+
+/**
+ * Return the paths which contain type information.
+ */
+function typePaths(config) {
+  var out = [
+      "node_modules/@types",
+  ];
+  var paths = (config.compilerOptions && config.compilerOptions.paths) || {};
+  Object.keys(paths).forEach( function eachEntry(k) {
+    // paths may contain a /*, eliminate it
+    paths[k].forEach(function eachPath(a) {
+      var p = a.split("/\*")[0];
+      if (out.indexOf(p) < 0) {
+        out.push(p);
+      }
+    });
+  });
+  debug("type paths", out);
+  return out;
+}
+
+TypeScriptPreprocessor.prototype.toTree = function(inputNode, inputPath, outputPath) {
+  var config = readConfig("./tsconfig.json");
+  // "include" setting is meant for the IDE integration,
+  // broccoli manages its own input files.
+  if (config.include) {
+    delete config.include;
+  }
+  config.include = ["**/*"];
+
+  /*
+   * Create a funnel with the type files used by the typescript compiler.
+   *
+   */
+  var types = find(process.cwd(), {
+    include: typePaths(config).map(function(a) { return a + '/**/*'})
+  });
+
+  /*
+   * Passthrough all the javascript files existing
+   * in the source/test folders.
+   */
+  var passthrough = new Funnel(inputNode, {
+    exclude: ["**/*.ts"],
+    annotation: "TypeScript passthrough"
+  });
+
+  /*
+   * Files to run through the typescript compiler.
+   */
+  var filter = new MergeTrees( [types, new Funnel(inputNode, {
+    include: ["**/*.ts"],
+    annotation: "TypeScript input"
+  })]);
+
+  /*
+   * Put everything together.
+   */
+  return new MergeTrees([
+    passthrough,
+    tsc(filter, {tsconfig: config})
+  ], {
+    overwrite: true,
+    annotation: "TypeScript passthrough + ouput"
+  });
+
+};
+
+
+module.exports = TypeScriptPreprocessor;

package.json

@@ -1,7 +1,7 @@
 {
   "name": "ember-cli-typescript",
   "version": "0.0.0",
-  "description": "The default blueprint for ember-cli addons.",
+  "description": "Allow ember apps to use typescript files.",
   "keywords": [
     "ember-addon"
   ],
@@ -11,7 +11,7 @@
     "doc": "doc",
     "test": "tests"
   },
-  "repository": "",
+  "repository": "https://github.com/emberwatch/ember-cli-typescript.git",
   "scripts": {
     "build": "ember build",
     "start": "ember server",
@@ -35,18 +35,29 @@
     "ember-cli-sri": "^2.1.0",
     "ember-cli-test-loader": "^1.1.0",
     "ember-cli-uglify": "^1.2.0",
-    "ember-data": "^2.10.0",
     "ember-disable-prototype-extensions": "^1.1.0",
     "ember-export-application-global": "^1.0.5",
     "ember-load-initializers": "^0.5.1",
     "ember-resolver": "^2.0.3",
-    "ember-welcome-page": "^1.0.3",
     "loader.js": "^4.0.10"
   },
   "engines": {
     "node": ">= 0.12.0"
   },
+  "dependencies": {
+    "@types/ember": "^2.7.34",
+    "broccoli-typescript-compiler": "^1.0.1",
+    "typescript": "^2.1.0",
+    "broccoli-funnel": "^1.0.6",
+    "broccoli-merge-trees": "^1.1.4",
+    "broccoli-plugin": "^1.2.1",
+    "debug": "^2.2.0",
+    "ember-cli-babel": "^5.1.7"
+  },
   "ember-addon": {
-    "configPath": "tests/dummy/config"
+    "configPath": "tests/dummy/config",
+    "before": [
+      "ember-cli-babel"
+    ]
   }
 }

tests/dummy/app/components/js-importing-ts.js

@@ -0,0 +1,7 @@
+import Ember from 'ember';
+
+import * as constants from '../lib/some-const';
+
+export default Ember.Component.extend({
+  poke: Ember.computed.equal('ha', constants.CHANGE)
+});

tests/dummy/app/components/test-one.js

@@ -0,0 +1,6 @@
+
+import Ember from 'ember';
+
+export default Ember.Component.extend({
+  someValue: 'from component'
+});

tests/dummy/app/components/ts-component.ts

@@ -0,0 +1,9 @@
+import Ember from 'ember';
+
+function compute() : {value:string} {
+  return {value: 'from component'};
+}
+
+export default Ember.Component.extend({
+  someValue: compute().value
+});

tests/dummy/app/controllers/application.ts

@@ -0,0 +1,6 @@
+import Ember from 'ember';
+
+export default Ember.Controller.extend({
+   // Just a very roundabout way of using some ES6 features
+   value: ((test = 'Test') => `${test} ${'Value'}`)()
+});

tests/dummy/app/lib/some-const.ts

@@ -0,0 +1,2 @@
+export const SPEED_OF_LIGHT=299792458;
+export const CHANGE=true;

tests/dummy/app/templates/application.hbs

@@ -0,0 +1,7 @@
+<h1>Hello</h1>
+
+This is code from ember-cli-typescript's test application.
+
+{{ts-component}}
+
+{{js-importing-ts}}

tests/dummy/app/templates/components/js-importing-ts.hbs

@@ -0,0 +1,4 @@
+<div style="border: 2px solid black;width: 100%; background-color: azure; margin-top: 20px; padding: 0 0 20px 20px">
+<p style="margin-top: 0px; border-bottom: chocolate 1px solid">js-importing-ts.hbs</p>
+{{poke}}
+</div>

tests/dummy/app/templates/components/ts-component.hbs

@@ -0,0 +1,8 @@
+<div style="border: 2px solid black;width: 100%; background-color: azure; margin-top: 20px; padding: 0 0 20px 20px">
+<p style="margin-top: 0px; border-bottom: chocolate 1px solid">ts-component.hbs</p>
+  {{#if someValue}}
+    Component defines <b>someValue</b> property as: {{someValue}}
+  {{else}}
+    <span style="color:red">Missing <b>someValue</b> property, expected to be defined by the component.</span>
+  {{/if}}
+</div>

tests/integration/components/dummy.ts

@@ -0,0 +1,4 @@
+/*
+ Need at least one ts file to avoid error
+ "No inputs were found in config file 'tsconfig.json'."
+*/

tests/integration/components/js-importing-ts-test.js

@@ -0,0 +1,16 @@
+import { moduleForComponent, test } from 'ember-qunit';
+import hbs from 'htmlbars-inline-precompile';
+
+moduleForComponent('js-importing-ts', 'Integration | Component | js importing ts', {
+  integration: true
+});
+
+test('it renders', function(assert) {
+  // Set any properties with this.set('myProperty', 'value');
+  // Handle any actions with this.on('myAction', function(val) { ... });
+
+  this.render(hbs`{{js-importing-ts}}`);
+
+  assert.equal(this.$().text().trim(), 'js-importing-ts.hbs\nfalse');
+
+});

tests/integration/components/ts-component-test.js

@@ -0,0 +1,16 @@
+import { moduleForComponent, test } from 'ember-qunit';
+import hbs from 'htmlbars-inline-precompile';
+
+moduleForComponent('ts-component', 'Integration | Component | ts component', {
+  integration: true
+});
+
+test('it renders', function(assert) {
+  // Set any properties with this.set('myProperty', 'value');
+  // Handle any actions with this.on('myAction', function(val) { ... });
+
+  this.render(hbs`{{ts-component}}`);
+
+  assert.equal(this.$().text().replace(/\s+/g,' ').trim(), 'ts-component.hbs Component defines someValue property as: from component');
+  
+});

tests/unit/dummy.ts

@@ -0,0 +1,4 @@
+/*
+ Need at least one ts file to avoid error
+ "No inputs were found in config file 'tsconfig.json'."
+*/