Mehrere anonym definiert in Modul Typescript mit Riot-ts (Riotjs)

Question

Ich muss sagen, dass die Einrichtung der Umgebung für Typescript ist mühsam und voller Frustration. Es ist keineswegs eine einfache Aufgabe.

Wie auch immer: I am still trying to setup riot-ts with JSPM. Ich bin weiter gekommen, aber es funktioniert nicht richtig.

Ich habe nun folgendes:

tsd.json:

{ 
"version": "v4", 
"repo": "borisyankov/DefinitelyTyped", 
"ref": "master", 
"path": "typings", 
"bundle": "typings/tsd.d.ts", 
"installed": { 
    "jquery/jquery.d.ts": { 
    "commit": "1be72cdce38fa12471085ac2cf39b0a901321720" 
    }, 
    "riotjs/riotjs.d.ts": { 
    "commit": "1be72cdce38fa12471085ac2cf39b0a901321720" 
    }, 
    "requirejs/require.d.ts": { 
    "commit": "1be72cdce38fa12471085ac2cf39b0a901321720" 
    } 
} 
} 

package.json:

{ 
    "devDependencies": { 
    "elixir-jasmine": "0.0.4", 
    "gulp": "^3.9.1", 
    "jspm": "^0.16.35", 
    "jspm-bower": "0.0.3", 
    "jspm-bower-endpoint": "^0.3.2", 
    "laravel-elixir": "^6.0.0-2", 
    "laravel-elixir-browsersync": "^0.1.5", 
    "tsd": "^0.6.5", 
    "typescript": "^1.9.0-dev.20160605-1.0", 
    "ws-laravel-elixir-typescript": "git+https://github.com/we-studio/laravel-elixir-typescript.git" 
    }, 
    "dependencies": { 
    "bootstrap": "^4.0.0-alpha.2" 
    }, 
    "jspm": { 
    "directories": { 
     "baseURL": "public" 
    }, 
    "dependencies": { 
     "jquery": "npm:jquery@^2.2.4", 
     "riot-ts": "bower:riot-ts@^0.0.22" 
    }, 
    "devDependencies": { 
     "typescript": "npm:typescript@^1.6.2" 
    } 
    } 
} 

gulpfile (Laravel):

function build(mix) { 
mix.sass('main.scss') 
    .typescript('app.js', undefined, { 
     "removeComments": true, 
     "module": "amd", 
     "target": "ES5", 
     "experimentalDecorators": true, 
     "sourceMap": true, 
     "moduleResolution": "node" 
    }) 
} 
elixir(build); 

Layout Dateien:

root 
     ↳/typings 
     ↳/assets 
     ↳/sass 
     ↳/typescript 
      ↳/stockmarket 
       ↳index.ts 
       ↳/barchart 
        ↳index.ts // export default class StockMarketBarChart extends Riot.Element 
     ↳boot.ts [contains: /// <reference path="../typings/tsd.d.ts" />] 
          // import StockMarketBarChart from './typescript/stockmarket/barchart'; 

resultierende app.js Datei:

var __extends = (this && this.__extends) || function (d, b) { 
    for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; 
    function __() { this.constructor = d; } 
    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); 
}; 
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { 
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; 
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); 
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; 
    return c > 3 && r && Object.defineProperty(target, key, r), r; 
}; 
define(["require", "exports"], function (require, exports) { 
    "use strict"; 
    var StockMarketBarChart = (function (_super) { 
     __extends(StockMarketBarChart, _super); 
     function StockMarketBarChart() { 
      _super.call(this); 
     } 
     StockMarketBarChart.prototype.mounted = function() { 
      debugger; 
     }; 
     StockMarketBarChart = __decorate([ 
      template("\n<stockmarket-barchart>\n <h3>{opts.title}</h3>\n <svg class=\"chart\" id=\"{chartId}\"></svg>\n</stockmarket-barchart>\n") 
     ], StockMarketBarChart); 
     return StockMarketBarChart; 
    }(Riot.Element)); 
    Object.defineProperty(exports, "__esModule", { value: true }); 
    exports.default = StockMarketBarChart; 
}); 

define(["require", "exports"], function (require, exports) { 
    "use strict"; 
}); 

define(["require", "exports"], function (require, exports) { 
    "use strict"; 
    var default_1 = (function() { 
     function default_1() { 
     } 
     return default_1; 
    }()); 
    Object.defineProperty(exports, "__esModule", { value: true }); 
    exports.default = default_1; 
}); 

in Chromkonsole Failing Nachricht: undefined: 1 Uncaught (in Versprechen) Fehler: Fehler: Mehrere anonyme definiert in Modul http://0.0.0.0:8080/js/app.js (...) Es gibt nur einen Import und SystemJS-Barfs.

Es gibt keine Kompilierungsfehler von Typescript. Dieser kommt von SystemJS.

Codebases: https://github.com/sidouglas/riot-ts

Answer 1

Gebrauchte /// <amd-module name="ModuleName"/> am Anfang jeder Datei, so SystemJS die Modulnamen ableiten könnte. Erledigt die Arbeit, obwohl es keine saubere Lösung ist.