ECMAScript ES11 applying in Vuejs 2.x

구축 환경 (vue-loader: 15.x 이상에서만 동작)

{
    "vue": "^2.6.11",
    "vue-loader": "15.9.5"
}

 

Installation template compiler

npm install vue-template-babel-compiler --save-dev

 

vue.config.js

// vue.config.js
module.exports = {
    chainWebpack: config => {
        config.module
            .rule('vue')
            .use('vue-loader')
            .tap(options => {
                options.compiler = require('vue-template-babel-compiler')
                return options
            })
    }
}

 

nuxt.config.js

// nuxt.config.js
export default {
  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {
    loaders: {
      vue: {
        compiler: require('vue-template-babel-compiler')
      }
    },
  },
  // ...
}

 

Optional Chaining 적용