Už jste někdy nastavovali Babel? Co to je? Už jste někdy sestavovali Webpack nebo používali jeho alternativy?

Babel je transpiler koji pretvara moderni JavaScript (ES6+) u stariju verziju koja je podržana od strane većine preglednika. Konfigurira se putem konfiguracijskog fajla (npr. .babelrc), u kojem se navode potrebni presetovi i dodaci za transformacije.

Webpack je modulni bundler koji kombinira različite resurse (JS, CSS, slike) u optimizirane pakete za preglednik. Njegova konfiguracija omogućava definiranje ulaznih točaka, loadera za različite tipove datoteka i dodataka za optimizaciju.

Alternativa Webpacku uključuju, na primjer, Rollup, Parcel ili Vite, koji mogu biti jednostavniji za konfiguraciju ili brži u radu.

Primjer jednostavne konfiguracije Babel (.babelrc):

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

Primjer osnovne konfiguracije 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'
        }
      }
    ]
  }
};