[태그:] babel

바벨을 설치하기 전에 webpack을 설치해야한다. 준비가 안되었을 경우 아래글을 먼저 읽기

npm을 이용해서 webpack 설치하기
http://blog.ujsstudio.com/?p=194

npm install --save-dev babel-loader @babel/core
npm install @babel/preset-env --save-dev

webpack.config.js에 바벨로더를 추가해준다

const path = require('path');
module.exports = {
  entry: './src/index.js',
  output: {
    filename: 'main.js',
    path: path.resolve(__dirname, 'dist')
  },
  devServer:{
    contentBase: './dist' //개발서버가 root가 아닌 dist 폴더를 인식
  },
  module: {
    rules: [
      { test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" }
    ]
  }
};

.babelrc 파일을 루트(webpack.config.js와 같은 위치)에 생성하고 아래와 같이 입력

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

npm run devserver 명령을 통해서 바벨이 잘 작동되는지 확인하면 된다.

참조
https://babeljs.io/setup