React - Missing semicolon(typescript-webpack)

React를 webpack 설정을 하다가 보면 다음과 같은 error 가 발생 할 수 있다.

 

typescript에서 변수의 type을 정할 때 사용하는 semicolon을 캐치를 못해서 생기는 오류이다.

이것을 해결하기 위해서는 

npm i @babel/preset-typescript

라이브러리를 설치를 하고 webpack 설정을 해주면 된다.

{presets: ['@babel/preset-typescipt']} 추가

 rules: [
        {
          test: /\.ts$|\.tsx$/,
          exclude: /node_modules/,
          use: {
            loader: "babel-loader",
            options: {
              presets: ['@babel/preset-env', '@babel/preset-react', '@babel/preset-typescript']
            }
          }
        },
      ]

 

참조(babel homepage)

https://babeljs.io/docs/en/babel-plugin-transform-typescript

Babel · The compiler for next generation JavaScript