Crea una cuenta o inicia sesión

¡Continúa aprendiendo sin ningún costo! Únete y comienza a potenciar tu carrera

Curso Práctico de Webpack

Curso Práctico de Webpack

Oscar Barajas Tavares

Oscar Barajas Tavares

Configuración de TypeScript

5/22
Recursos

Aportes 2

Preguntas 1

Ordenar por:

¿Quieres ver más aportes, preguntas y respuestas de la comunidad? Crea una cuenta o inicia sesión.

Configuración de TypeScript

Typescript npm:

npm install typescript ts-loader @types/express -D
  • Cambiamos la extensión de src/index.js a index.ts:
    Adaptamos Index a typescript:
import * as express from 'express';
import { Request, Response } from 'express';

const app = express();
const port = 3000;

app.get('/', (req: Request, res: Response) => {
    res.send('Hello Typescript')
});

app.listen(port, () => {
    console.log(`App listening on port: ${port}`);
})
  • Creamos en la raiz el archivo .env (variables de entorno).
    .env :
POST=3005
NODE_ENV=development
  • En Webpack.config.js
const path = require('path');
// path: la ubicacion del proyecto
const NODE_ENV = process.env.NODE_ENV;
const PORT = process.env.PORT;
...
module.exports = {
    name: 'express-server',
// ACTUALIZAMOS LA EXTENSIÓN DE INDEX
    entry: './src/index.ts',
    target: 'node',
// AÑADIMOS: mode
    mode: NODE_ENV,
// en resolve:
 extensions: ['.ts','.js']
// en rules añadimos
{
        test: /\.ts$/,
        use: [
            'ts-loader',
         ]
 }
  • Creamos el archivo tsconfig.json:
{
    "compilerOptions": {
        "sourceMap": true,
    }
}

Por ultimo instalamos:

npm install webpack-node-externals -D

Añadimos en webpack.config.js:

const path = require('path');
const nodeExternals = require('webpack-node-externals');
....
module.exports = {
    mode: NODE_ENV,
    externals: [nodeExternals()],
}

y npm run build