underfin / vite-plugin-vue2

Vue2 plugin for Vite
621 stars 83 forks source link

Support/Enhancement for other Babel Plugins - Null Coalescing Operator, Optional Chaining and others #161

Open Kaustix opened 2 years ago

Kaustix commented 2 years ago

Requesting an Enhancement or Support for adding the bellow babel plugin support for vue templates. I know there's a fork of this project that has included support for these https://github.com/pedro-gilmora/vite-vue2, however it would be better if these were added out the box as the fork seems to be behind and not being actively supported. Is this something that can be added to vue templates?

@babel/plugin-proposal-nullish-coalescing-operator @babel/plugin-proposal-optional-chaining @babel/plugin-transform-arrow-functions @babel/plugin-transform-block-scoping @babel/plugin-transform-destructuring @babel/plugin-transform-parameters @babel/plugin-transform-spread

NikhilVerma commented 2 years ago

Here is a solution if you are using a package manager which supports resolutions in package.json

{
  "resolutions": {
    "vue-template-es2015-compiler": "npm:vue-template-babel-compiler@1.1.3"
  }
}
souljorje commented 2 years ago

@NikhilVerma which bundlers do this?

NikhilVerma commented 2 years ago

@souljorje Apologies I meant package manager. so

  1. Yarn
  2. pnpm
  3. npm with https://www.npmjs.com/package/npm-force-resolutions
caocos commented 2 years ago

npm install vue-template-babel-compiler -D

createVuePlugin({
    //........
    vueTemplateOptions: {
      compiler: require('vue-template-babel-compiler'),
      compilerOptions: {
        whitespace: 'preserve'
      }
    }
  })

Optional chaining in templates does not seem to work

[vite] Internal server error: invalid expression: Unexpected token '.'

NikhilVerma commented 2 years ago

I've made a PR to fix this issue - https://github.com/underfin/vite-plugin-vue2/pull/179