É Possivel se Livrar dos ".js" em Tempo de Desenvolvimento quando se trabalha com TypeScript?

Opa Claudio, não manjo de angular 2 em si, então foi buscar no pai google alguma sugestão. Achei uma discussão no stackoverflow falando algo parecido com o que quer => http://stackoverflow.com/questions/34684527/separate-angular2-typescript-files-and-javascript-files-into-different-folders

Você vai precisar alterar seu arquivo tsconfig.json para trocar o local de geração dos arquivos compilados. Não testei, mas acho que ficaria algo assim:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
     "outDir": "dist"
  }
}

Esse dist aí pode ser qq diretório na verdade.. Só que parece implica em outras alterações na sua configuração. A minha opinião é que se vc escolheu o angular-cli, deveria ficar com os defaults dele, para não ficar perdendo tempo com isso. Algo parecido acontece com o create-react-app, para criar aplicações com react.

Eu tentei e não consegui colocar para funcionar. Como eu faço para compilar o typescript pelo browser?

A única solução que encontrei foi usando o Angular-Cli: https://cli.angular.io/. Mas vale advertir que haverão de serem feitas algumas adaptações para compatiblizar o Alurapic. Por exemplo: O arquivo "styles.css" que vem no ACli (Angular Cli) é um arquivo de css global. Isso significa que as modificações feitas nele irão afetar todos os componentes da aplicacao. Portanto, para importar o estilo do bootstrap eu me utilizei desse arquivo adicionando a linha

@import url("../node_modules/bootstrap/dist/css/bootstrap.min.css");

Claro que também tive que adaptar ligeiramente o arquivo "package.json" para incluir o bootstrap em suas dependencias.

Alerto também que usar o ACli trará problemas de CORS, o que nos obrigará a fazer adaptações do lado do serviço também.