Szerkesztette már a Babel-t? Mi ez? Szerkesztette már a Webpack-ot vagy használt alternatívákat?

A Babel egy transzpilátor, amely a modern JavaScript-et (ES6+) régebbi, a legtöbb böngésző által támogatott verzióvá alakítja. Konfigurálása egy konfigurációs fájl (például .babelrc) segítségével történik, ahol megadjuk a szükséges preseteket és plugineket.

A Webpack egy modulcsomagoló, amely különböző erőforrásokat (JS, CSS, képek) összefoglalóan optimalizált csomagokká egyesít a böngésző számára. Konfigurációja lehetővé teszi a belépési pontok, a különböző fájltípusokat kezelő betöltők (loaders) és a optimalizációs pluginek beállítását.

Alternatívák a Webpackhez például a Rollup, Parcel vagy Vite, amelyek egyszerűbb konfigurációt vagy gyorsabb működést kínálnak.

Egyszerű Babel konfigurációs példa (.babelrc):

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

Alap Webpack konfigurációs példa (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'
        }
      }
    ]
  }
};