Դու երբևէ կարգավորե՞լ ես Babel-ը: Ի՞նչ է դա: Դու երբևէ հավաքե՞լ ես Webpack-ը կամ օգտագործե՞լ նրա այլընտրանքները:

Babel-ը մի թրանսփայլեր է, որը փոխում է ժամանակակից JavaScript (ES6+) կոդը ավելի հին և լայնորեն աջակցվող տարբերակ: Այն կարգավորում է ֆայլի միջոցով (օրինակ, .babelrc), որտեղ նշվում են անհրաժեշտ presets-ները և plugins-ները:

Webpack-ը մոդուլների հավաքող է, որը միավորում է տարբեր ռեսուրսներ (JS, CSS, պատկերներ) օպտիմալացված բանդլների: Նրա կարգավորումը թույլ է տալիս սահմանել մուտքի կետերը, loader-ները տարբեր ֆայլերի համար և plugins-ները օպտիմալացման համար:

Ալտերնատիվներ Webpack-ի համար են՝ օրինակ, Rollup, Parcel կամ Vite, որոնք կարող են լինել ավելի պարզ կարգավորելու կամ ավելի արագ:

Նմուշ Babel-ի պարզ կարգավորումը (.babelrc):

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

Նմուշ 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'
        }
      }
    ]
  }
};