V-ați configurat vreodată Babel? Ce este asta? Ați compilat vreodată Webpack sau ați folosit alternative?

Babel este un transpilator care convertește JavaScript-ul modern (ES6+) într-o versiune mai veche, compatibilă cu majoritatea browserelor. Se configurează printr-un fișier de configurare (de exemplu, .babelrc), unde se specifică preseturile și pluginurile necesare pentru transformări.

Webpack este un bundler de module care combină diverse resurse (JS, CSS, imagini) în pachete optimizate pentru browser. Configurarea sa permite stabilirea punctelor de intrare, a loader-ilor pentru diferite tipuri de fișiere și a pluginurilor pentru optimizare.

Alternative la Webpack includ, de exemplu, Rollup, Parcel sau Vite, care pot fi mai simple de configurat sau mai rapide.

Exemplu de configurație simplă pentru Babel (.babelrc):

{
  "presets": ["@babel/preset-env"]
}

Exemplu de configurație de bază pentru Webpack (webpack.config.js):

module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'bundle.js',
    path: __dirname + '/dist'
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      }
    ]
  }
};