Bom dia pessoal,
Estou tomando erro ao carregar a NegociacaoController, estou usando o lite-server e o system.js para carregar os arquivos typescript na index do projeto.
No cmd não dá erro de compilação e a página é carregada, porém no navegador (chrome), está dando os seguintes erros:
GET http://localhost:3000/ts/controllers/NegociacaoController.js 404 (Not Found)
(index):51 (SystemJS) XHR error (404 Not Found) loading http://localhost:3000/ts/controllers/NegociacaoController.js
Error: XHR error (404 Not Found) loading http://localhost:3000/ts/controllers/NegociacaoController.js
Error loading http://localhost:3000/ts/controllers/NegociacaoController.js as "../ts/controllers/NegociacaoController" from http://localhost:3000/js/app.js
sabem o que pode ser?
Instalei as mesmas versões de typsescript, concurrently e lite-server usadas no curso.
NegociacaoController
import { Negociacao, Negociacoes } from '../models/index';
import { NegociacoesView, MensagemView } from '../views/index';
import { logarTempoDeExecucao } from '../helpers/decorators/index';
export class NegociacaoController {
private _inputData: JQuery;
private _inputQuantidade: JQuery;
private _inputValor: JQuery;
private _negociacoes = new Negociacoes();
private _negociacoesView = new NegociacoesView('#negociacoesView', true);
private _mensagemView = new MensagemView('#mensagemView');
constructor(){
this._inputData = $('#data');
this._inputQuantidade = $('#quantidade');
this._inputValor = $('#valor');
this._negociacoesView.update(this._negociacoes, false);
let temCarteira: boolean = true;
}
@logarTempoDeExecucao()
adiciona(event: Event){
const t1 = performance.now();
event.preventDefault();
let data = new Date(this._inputData.value.replace(/-/g,','));
if(!this._ehDiaUtil(data)){
this._mensagemView.update('Somente negociações em dias úteis por favor', true);
return;
}
const negociacao = new Negociacao(
data,
parseInt(this._inputQuantidade.value),
parseFloat(this._inputValor.value)
);
this._negociacoes.adiciona(negociacao);
this._negociacoesView.update(this._negociacoes, false);
this._mensagemView.update('Negociação adicionada com sucesso!', false);
const t2 = performance.now();
console.log(`O tempo de execução de adiciona é de ${ t2 - t1 } `);
}
private _ehDiaUtil(data: Date) {
return data.getDay() != DiaDaSemana.Sabado && data.getDay() != DiaDaSemana.Domingo;
}
}
enum DiaDaSemana {
Domingo,
Segunda,
Terca,
Quarta,
Quinta,
Sexta,
Sabado
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Negociações</title>
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/bootstrap-theme.css">
</head>
<body class="container">
<h1 class="text-center">Negociações</h1>
<div id="mensagemView"></div>
<form class="form">
<div class="form-group">
<label for="data">Data</label>
<input type="date" id="data" class="form-control" required autofocus/>
</div>
<div class="form-group">
<label for="quantidade">Quantidade</label>
<input type="number" min="1" step="1" id="quantidade" class="form-control" value="1" required/>
</div>
<div class="form-group">
<label for="valor">Valor</label>
<input id="valor" type="number" class="form-control" min="0.01" step="0.01" value="0.0" required />
</div>
<button class="btn btn-primary" type="submit">Incluir</button>
</form>
<br>
<br>
<div id='negociacoesView'></div>
<script src="lib/jquery.min.js"></script>
<!-- biblioteca para importação de módulos TypeScript/javaScript -->
<!-- é o modelo de importação do ecmascript 2015 -->
<script src="lib/system.js"></script>
<script>
System.defaultJSExtensions = true;
System.import('js/app.js').catch(err => console.error(err));
</script>
</body>
</html>