Meu código encontra-se aqui:
https://gitlab.com/estudos.alura/formacao-react/projeto-webpack
Após executar o comando "npm start" as funcionalidades do sistema não funcionam.
Estou na aula: "Babel-loader, a ponte entre o Webpack e o Babel"
Meu código encontra-se aqui:
https://gitlab.com/estudos.alura/formacao-react/projeto-webpack
Após executar o comando "npm start" as funcionalidades do sistema não funcionam.
Estou na aula: "Babel-loader, a ponte entre o Webpack e o Babel"
Fala ai André, tudo bem? Acho que acabou faltando você instalar o babel-loader
e configurá-lo no arquivo de configuração do Webpack.
O primeiro passo será instalar o loader:
npm install babel-loader@7.1.0
Depois, precisamos pedir para o Webpack fazer uso dele quando os arquivos forem .js
:
const path = require('path');
module.exports = {
entry: './app-src/app.js',
output: {
filename: 'bundle.js',
// ('__dirname') => váriavel do nodejs que diz qual é o diretório atual desse módulo, ou seja,
// do módulo criado em webpack.config.js, onde esse módulo se encontra _
path: path.resolve(__dirname, 'dist')
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader'
}
}
]
},
}
Repare que adicionamos uma configuração chamada module
que possuí um array
de rules
(regras).
Isso talvez resolva seu problema.
Obs: Lembrando que você precisa buildar o código para depois rodar o start
:
npm run build-dev // na pasta client
npm start // na pasta server
Espero ter ajudado.
Infelizmente não funcionou.
Atualizei o código e realizei o push para o repositório.
Quando inicio o sistema, ou seja, "'npm start' // na pasta server" o sistema não funciona.
Segue imagem da tela:
Repara que a tabela com as negociações não aparece, mesmo sem dados é para aparecer a tabela vazia.
Também não inclui nenhuma negociação
Fala ai André, tudo bem? O problema está na importação do seu dist/bundle.js
.
Seu código:
<script str="/dist/bundle.js"></script>
Repare que o atributo está definido como str
, quando, na verdade deveria ser src
.
<script src="/dist/bundle.js"></script>
Com essa mudança acredito que o mesmo volte a funcionar.
Espero ter ajudado.